From 94e7b997127ed0bbdc8a7c9fde828a9d04480941 Mon Sep 17 00:00:00 2001
From: Firman Ramdhani <33869609+firmanramdhani@users.noreply.github.com>
Date: Thu, 23 Jul 2026 16:50:09 +0700
Subject: [PATCH] refactor: remove unused DataTable component and clean up
filter logic in FullPagePageIndex
---
.../presentation/components/data-table.tsx | 261 ------------------
.../components/filter-content.tsx | 16 +-
.../pages/full-page.page.index.tsx | 17 --
.../core-i18n/src/languages/en/common.json | 2 +-
.../core-i18n/src/languages/id/common.json | 2 +-
.../components/data-table/index.tsx | 28 +-
.../providers/detail-page.provider.tsx | 2 +-
7 files changed, 20 insertions(+), 308 deletions(-)
delete mode 100644 apps/web/src/apps/modules/example/full-page/presentation/components/data-table.tsx
diff --git a/apps/web/src/apps/modules/example/full-page/presentation/components/data-table.tsx b/apps/web/src/apps/modules/example/full-page/presentation/components/data-table.tsx
deleted file mode 100644
index 4f88c99..0000000
--- a/apps/web/src/apps/modules/example/full-page/presentation/components/data-table.tsx
+++ /dev/null
@@ -1,261 +0,0 @@
-import { useState, useCallback } from 'react';
-import {
- Table,
- Box,
- Paper,
- Badge,
- Text,
- Group,
- Button,
- TextInput,
- Pagination,
- Select,
- ScrollArea,
-} from '@repo/ui/components';
-import { PageActions } from '@repo/ui/components';
-import { useEnterpriseModuleTranslationContext, useEnterpriseModuleNavigationContext } from '@repo/ui/foundations';
-import { FullPageEntity } from '../../domain/entities';
-import { Edit2, Eye, Copy, Trash2, Search, Filter, CheckCircle2, Ban } from 'lucide-react';
-
-// TODO: Replace this mock data with real API data loaded from DataService via useEnterpriseModuleDataServiceContext
-const MOCK_DATA: FullPageEntity[] = Array.from({ length: 50 }).map((_, i) => ({
- id: String(i + 1),
- name: `Database Cluster ${i + 1}`,
- code: `DB-PROD-${String(i + 1).padStart(3, '0')}`,
- status: i % 7 === 0 ? 'MAINTENANCE' : i % 4 === 0 ? 'INACTIVE' : 'ACTIVE',
- description: `Managed PostgreSQL cluster instance in region us-east-${(i % 3) + 1}`,
-}));
-
-export function DataTable() {
- const { t } = useEnterpriseModuleTranslationContext();
- const { navigateToDetail, navigateToEdit, navigateToDuplicate } = useEnterpriseModuleNavigationContext();
-
- const [page, setPage] = useState(1);
- const [pageSize, setPageSize] = useState(10);
-
- const totalRecords = MOCK_DATA.length;
- const totalPages = Math.ceil(totalRecords / pageSize);
- const paginatedData = MOCK_DATA.slice((page - 1) * pageSize, page * pageSize);
-
- const getRowActions = useCallback(
- (row: FullPageEntity) => [
- {
- key: 'view',
- label: t('common:view'),
- icon: ,
- onClick: () => navigateToDetail(row.id as string),
- },
- {
- key: 'edit',
- label: t('common:edit'),
- icon: ,
- onClick: () => navigateToEdit(row.id as string),
- },
- {
- key: 'duplicate',
- label: t('common:duplicate'),
- icon: ,
- onClick: () => navigateToDuplicate(row.id as string),
- },
- {
- type: 'divider' as const,
- key: 'div-1',
- },
- {
- key: 'delete',
- label: t('common:delete'),
- icon: ,
- intent: 'destructive' as const,
- onClick: () => {
- // Mock delete action
- alert(`Delete ${row.name}`);
- },
- },
- ],
- [t, navigateToDetail, navigateToEdit, navigateToDuplicate],
- );
-
- const rows = paginatedData.map((item) => (
-
-
-
- {item.code}
-
-
-
-
- {item.name}
-
-
-
-
- {item.status}
-
-
-
-
- {item.description}
-
-
-
-
-
-
- ));
-
- return (
-
- {/* --- TABLE TOOLBAR --- */}
-
-
-
- }
- size="sm"
- radius="md"
- w={280}
- />
- }
- >
- Filters
-
-
-
-
-
- }
- >
- Activate
-
- }
- >
- Deactivate
-
- }
- >
- Delete
-
-
-
-
-
- {/* --- END TABLE TOOLBAR --- */}
-
-
-
-
-
-
- {t('fields.code')}
-
-
- {t('fields.name')}
-
-
- {t('fields.status')}
-
-
- {t('fields.description')}
-
-
- Actions
-
-
-
- {rows}
-
-
-
- {/* --- PAGINATION FOOTER --- */}
-
-
-
- Showing{' '}
-
- {(page - 1) * pageSize + 1}
- {' '}
- to{' '}
-
- {Math.min(page * pageSize, totalRecords)}
- {' '}
- of{' '}
-
- {totalRecords}
- {' '}
- entries
-
-
-
-
- Rows per page:
-
-
-
-
-
-
- {/* --- END PAGINATION FOOTER --- */}
-
- );
-}
diff --git a/apps/web/src/apps/modules/example/full-page/presentation/components/filter-content.tsx b/apps/web/src/apps/modules/example/full-page/presentation/components/filter-content.tsx
index ba4d61f..0bc398d 100644
--- a/apps/web/src/apps/modules/example/full-page/presentation/components/filter-content.tsx
+++ b/apps/web/src/apps/modules/example/full-page/presentation/components/filter-content.tsx
@@ -1,21 +1,8 @@
-import { useEffect } from 'react';
import { SimpleGrid } from '@repo/ui/components';
import { FieldTextInput } from '@repo/ui/form';
-import { UseFormReturn, useWatch } from 'react-hook-form';
+import { UseFormReturn } from 'react-hook-form';
export const FilterFormContent = ({ form, t }: { form: UseFormReturn; t: any }) => {
- const codeValue = useWatch({
- control: form.control,
- name: 'code',
- });
-
- useEffect(() => {
- if (!codeValue) {
- form.setValue('name', '');
- form.clearErrors('name');
- }
- }, [codeValue, form]);
-
return (
; t: an
name="name"
label={t('fields.name')}
placeholder={`Enter ${t('fields.name')}`}
- disabled={!codeValue}
/>
);
diff --git a/apps/web/src/apps/modules/example/full-page/presentation/pages/full-page.page.index.tsx b/apps/web/src/apps/modules/example/full-page/presentation/pages/full-page.page.index.tsx
index 94f4467..418bd99 100644
--- a/apps/web/src/apps/modules/example/full-page/presentation/pages/full-page.page.index.tsx
+++ b/apps/web/src/apps/modules/example/full-page/presentation/pages/full-page.page.index.tsx
@@ -4,28 +4,12 @@ import {
EnterpriseDataTable,
} from '@repo/ui/foundations';
import { ColDef } from '@repo/ui/components';
-import { z } from 'zod';
import { Trans } from '@repo/core-i18n';
import { Text } from '@repo/ui/components';
import { LayoutDashboard } from 'lucide-react';
import { useMemo } from 'react';
import { FilterFormContent } from '../components/filter-content';
-const filterSchema = z
- .object({
- code: z.string().optional(),
- name: z.string().optional(),
- })
- .superRefine((data, ctx) => {
- if (data.code && !data.name) {
- ctx.addIssue({
- path: ['name'],
- code: z.ZodIssueCode.custom,
- message: 'Name is required when code is provided',
- });
- }
- });
-
export default function FullPagePageIndex() {
const { t } = useEnterpriseModuleTranslationContext();
@@ -38,7 +22,6 @@ export default function FullPagePageIndex() {
const filterConfig = useMemo(() => {
return {
- schema: filterSchema,
renderBody: (form: any) => {
if (!form) return null;
return ;
diff --git a/packages/core-i18n/src/languages/en/common.json b/packages/core-i18n/src/languages/en/common.json
index 2f7fa3f..31e0767 100644
--- a/packages/core-i18n/src/languages/en/common.json
+++ b/packages/core-i18n/src/languages/en/common.json
@@ -40,7 +40,7 @@
"collapseAll": "Collapse all menu",
"searchMenu": "Search menu",
"searchData": "Search data",
- "searchPlaceholder": "Type to search & press Enter...",
+ "searchPlaceholder": "Type to search & press enter...",
"collapse": "Collapse",
"expandSidebar": "Expand Sidebar",
"filterTitle": "Filter {{module}}",
diff --git a/packages/core-i18n/src/languages/id/common.json b/packages/core-i18n/src/languages/id/common.json
index c22cb9a..cbfa935 100644
--- a/packages/core-i18n/src/languages/id/common.json
+++ b/packages/core-i18n/src/languages/id/common.json
@@ -40,7 +40,7 @@
"collapseAll": "Tutup semua menu",
"searchMenu": "Cari menu",
"searchData": "Cari data",
- "searchPlaceholder": "Ketik pencarian & tekan Enter...",
+ "searchPlaceholder": "Ketik pencarian & tekan enter...",
"collapse": "Tutup",
"expandSidebar": "Perluas Bilah Sisi",
"filterTitle": "Filter {{module}}",
diff --git a/packages/ui/src/foundations/enterprise-module/components/data-table/index.tsx b/packages/ui/src/foundations/enterprise-module/components/data-table/index.tsx
index cb12d5e..b423fae 100644
--- a/packages/ui/src/foundations/enterprise-module/components/data-table/index.tsx
+++ b/packages/ui/src/foundations/enterprise-module/components/data-table/index.tsx
@@ -13,7 +13,11 @@ import {
} from 'ag-grid-community';
import { Box, Group, TextInput, Indicator, CloseButton } from '@mantine/core';
import { useDisclosure } from '@mantine/hooks';
-import { Search, Filter, Settings } from 'lucide-react';
+import {
+ Search,
+ Filter,
+ // Settings
+} from 'lucide-react';
import { DataGrid, StatusBadge, PageActions } from '../../../../components';
import type { PageActionProps } from '../../../../components';
@@ -205,7 +209,7 @@ export function EnterpriseDataTable(props: EnterpriseDataT
// Local UI State
// ---------------------------------------------------------------------------
const [openedFilter, { open: openFilter, close: closeFilter }] = useDisclosure(false);
- const [openedSetting, { open: openSetting, close: closeSetting }] = useDisclosure(false);
+ // const [openedSetting, { open: openSetting, close: closeSetting }] = useDisclosure(false);
const moduleTitle = config.tabTitle || t(`${config.translationNamespace}:title`);
// Reference to the AG Grid API for programmatic interaction
@@ -829,14 +833,14 @@ export function EnterpriseDataTable(props: EnterpriseDataT
tooltipLabel: t('common:actions.filter'),
onClick: openFilter,
},
- {
- key: 'setting',
- icon: ,
- variant: 'default',
- showLabel: false,
- tooltipLabel: t('common:actions.setting'),
- onClick: openSetting,
- },
+ // {
+ // key: 'setting',
+ // icon: ,
+ // variant: 'default',
+ // showLabel: false,
+ // tooltipLabel: t('common:actions.setting'),
+ // onClick: openSetting,
+ // },
]}
/>
@@ -907,11 +911,11 @@ export function EnterpriseDataTable(props: EnterpriseDataT
onFilter={handleFilterApply}
/>
-
+ /> */}
);
}
diff --git a/packages/ui/src/foundations/enterprise-module/providers/detail-page.provider.tsx b/packages/ui/src/foundations/enterprise-module/providers/detail-page.provider.tsx
index 86e91be..84d91a2 100644
--- a/packages/ui/src/foundations/enterprise-module/providers/detail-page.provider.tsx
+++ b/packages/ui/src/foundations/enterprise-module/providers/detail-page.provider.tsx
@@ -631,7 +631,7 @@ export function EnterpriseDetailPageProvider(
style: { fontSize: 12 },
};
}}
- actions={pageActions}
+ actions={detailData ? pageActions : []}
{...pageHeaderPropsValue}
moduleKey={moduleKey}
titleProps={{