feat: implement unified delete dialog component and update related pages

app/pages/dashboard-advertisements/index.tsx

@@ -9,13 +9,12 @@ import { useState } from 'react'
 import { Link, useRouteLoaderData } from 'react-router'
 
 import type { TAdResponse } from '~/apis/common/get-ads'
+import { DialogDelete } from '~/components/dialog/delete'
 import { Button } from '~/components/ui/button'
 import { UiTable } from '~/components/ui/table'
 import { TitleDashboard } from '~/components/ui/title-dashboard'
 import type { loader } from '~/routes/_admin.lg-admin._dashboard.advertisements._index'
 
-import { DialogDelete } from './dialog-delete'
-
 export const AdvertisementsPage = () => {
   const loaderData = useRouteLoaderData<typeof loader>(
     'routes/_admin.lg-admin._dashboard.advertisements._index',
@@ -101,7 +100,23 @@ export const AdvertisementsPage = () => {
       <DialogDelete
         selectedItem={selectedAds}
         setSelectedItem={setSelectedAds}
-      />
+        title="Banner iklan"
+        fetcherAction={`/actions/admin/advertisements/delete/${selectedAds?.id}`}
+      >
+        <img
+          src={selectedAds?.image_url}
+          alt={selectedAds?.image_url}
+          className="aspect-[150/1] h-[50px] rounded object-contain"
+        />
+        <Button
+          as={Link}
+          to={selectedAds?.url || ''}
+          variant="link"
+          size="fit"
+        >
+          {selectedAds?.url}
+        </Button>
+      </DialogDelete>
     </div>
   )
 }