Deps Update + Table improvements (#351)

* fix: enhance DataTable pagination examples and improve display logic

- Added a note in the DataTableStory component to clarify that examples show only the first page of data for demonstration purposes.
- Adjusted pagination examples to reflect smaller datasets, changing the displayed data slices for better clarity and testing.
- Updated the Pagination component to calculate and display the current record range more accurately based on the current page index and size.

* chore(dependencies): update package versions for improved compatibility

- Upgraded `@supabase/supabase-js` from `2.55.0` to `2.57.0` for enhanced functionality and performance.
- Bumped `@tanstack/react-query` from `5.85.5` to `5.85.9` to incorporate the latest improvements.
- Updated `ai` from `5.0.28` to `5.0.30` for better performance.
- Incremented `nodemailer` from `7.0.5` to `7.0.6` for stability.
- Updated `typescript-eslint` from `8.41.0` to `8.42.0` for improved type definitions and linting capabilities.
- Adjusted various package dependencies across multiple components to ensure compatibility and stability.

* chore(dependencies): update package versions for improved compatibility

- Upgraded `@ai-sdk/openai` from `2.0.23` to `2.0.24` for enhanced functionality.
- Bumped `@tanstack/react-query` from `5.85.9` to `5.86.0` to incorporate the latest improvements.
- Updated `ai` from `5.0.30` to `5.0.33` for better performance.
- Incremented `@types/node` from `24.3.0` to `24.3.1` for type safety enhancements.
- Updated `dotenv` from `17.2.1` to `17.2.2` for stability.
- Adjusted `tailwindcss` and related packages to `4.1.13` for improved styling capabilities.
- Updated `react-i18next` from `15.7.3` to `15.7.3` to include the latest localization fixes.
- Incremented `@sentry/nextjs` from `10.8.0` to `10.10.0` for enhanced monitoring features.
- Updated various package dependencies across multiple components to ensure compatibility and stability.

* fix(config): conditionally disable `devIndicators` in CI environment

* feat(settings): encapsulate danger zone actions in a styled card component

- Introduced a new `DangerZoneCard` component to enhance the visual presentation of danger zone actions in the team account settings.
- Updated `TeamAccountDangerZone` to wrap deletion and leave actions within the `DangerZoneCard` for improved user experience.
- Removed redundant card structure from `TeamAccountSettingsContainer` to streamline the component hierarchy.

* fix(e2e): improve admin account tests for response handling and visibility checks

- Enhanced the admin test suite by adding a check for the POST request method when waiting for the response from the `/admin/accounts` endpoint.
- Reduced wait times in the `filterAccounts` function for improved test performance.
- Updated the `selectAccount` function to ensure the account link is visible before clicking, enhancing reliability in the test flow.

* chore(dependencies): update package versions for improved compatibility

- Upgraded `@supabase/supabase-js` from `2.57.0` to `2.57.2` for enhanced functionality and performance.
- Bumped `@tanstack/react-query` from `5.86.0` to `5.87.1` to incorporate the latest improvements.
- Updated `i18next` from `25.5.1` to `25.5.2` for better localization support.
- Incremented `eslint` from `9.34.0` to `9.35.0` for improved linting capabilities.
- Adjusted various package dependencies across multiple components to ensure compatibility and stability.

* feat(admin): enhance user ban and reactivation actions with success handling

- Updated `AdminBanUserDialog` and `AdminReactivateUserDialog` components to handle success states based on the results of the respective actions.
- Modified `banUserAction` and `reactivateUserAction` to return success status and log errors if the actions fail.
- Introduced `revalidatePage` function to refresh the user account page after banning or reactivating a user.
- Improved error handling in the dialogs to provide better feedback to the admin user.

* feat(admin): refactor user ban and reactivation dialogs for improved structure and error handling

- Introduced `BanUserForm` and `ReactivateUserForm` components to encapsulate form logic within the respective dialogs, enhancing readability and maintainability.
- Updated the `AdminBanUserDialog` and `AdminReactivateUserDialog` components to utilize the new form components, streamlining the user interface.
- Enhanced error handling to provide clearer feedback to the admin user during ban and reactivation actions.
- Removed unnecessary revalidation calls in the server actions to optimize performance and maintain clarity in the action flow.
- Added `@types/react-dom` dependency for improved type definitions.

* refactor(admin): streamline user dialogs and server actions for improved clarity

- Removed unnecessary `useRouter` imports from `AdminBanUserDialog` and `AdminReactivateUserDialog` components to simplify the code.
- Updated `revalidateAdmin` function calls to use `revalidatePath` with specific paths, enhancing clarity in the server actions.
- Ensured that the user dialogs maintain a clean structure while focusing on form logic and error handling.
This commit is contained in:
Giancarlo Buomprisco
2025-09-06 17:30:09 +07:00
committed by GitHub
parent b3acbbe801
commit 9fae142f2d
37 changed files with 2293 additions and 2313 deletions

View File

@@ -1248,6 +1248,16 @@ export function DataTableStory() {
</CardHeader>
<CardContent>
<div className="space-y-6">
{/* Note about pagination examples */}
<div className="rounded-lg border border-amber-200 bg-amber-50 p-3">
<p className="text-sm text-amber-800">
<strong>Note:</strong> These examples show only the first page
of data for demonstration. In a real application, pagination
would fetch different pages from your backend based on the
current page index.
</p>
</div>
{/* Small dataset with pagination */}
<div className="space-y-3">
<h4 className="text-sm font-semibold">
@@ -1267,7 +1277,7 @@ export function DataTableStory() {
),
},
]}
data={data.slice(0, 15)}
data={data.slice(0, 5)}
pageSize={5}
pageCount={3}
getRowId={(row) => row.id}
@@ -1303,7 +1313,7 @@ export function DataTableStory() {
},
},
]}
data={data.slice(0, 30)}
data={data.slice(0, 10)}
pageSize={10}
pageCount={3}
getRowId={(row) => row.id}
@@ -1416,7 +1426,7 @@ export function DataTableStory() {
size: 80,
},
]}
data={data.slice(0, 50)}
data={data.slice(0, 15)}
pageSize={15}
pageCount={Math.ceil(50 / 15)}
getRowId={(row) => row.id}

View File

@@ -8,14 +8,14 @@
"format": "prettier --check --write \"**/*.{js,cjs,mjs,ts,tsx,md,json}\""
},
"dependencies": {
"@ai-sdk/openai": "^2.0.23",
"@ai-sdk/openai": "^2.0.24",
"@faker-js/faker": "^10.0.0",
"@hookform/resolvers": "^5.2.1",
"@tanstack/react-query": "5.85.5",
"ai": "5.0.28",
"@tanstack/react-query": "5.87.1",
"ai": "5.0.33",
"lucide-react": "^0.542.0",
"next": "15.5.2",
"nodemailer": "^7.0.5",
"nodemailer": "^7.0.6",
"react": "19.1.1",
"react-dom": "19.1.1",
"rxjs": "^7.8.2"
@@ -27,8 +27,8 @@
"@kit/shared": "workspace:*",
"@kit/tsconfig": "workspace:*",
"@kit/ui": "workspace:*",
"@tailwindcss/postcss": "^4.1.12",
"@types/node": "^24.3.0",
"@tailwindcss/postcss": "^4.1.13",
"@types/node": "^24.3.1",
"@types/nodemailer": "7.0.1",
"@types/react": "19.1.12",
"@types/react-dom": "19.1.9",
@@ -36,7 +36,7 @@
"pino-pretty": "13.0.0",
"react-hook-form": "^7.62.0",
"recharts": "2.15.3",
"tailwindcss": "4.1.12",
"tailwindcss": "4.1.13",
"tailwindcss-animate": "^1.0.7",
"typescript": "^5.9.2",
"zod": "^3.25.74"

View File

@@ -13,8 +13,8 @@
"license": "ISC",
"devDependencies": {
"@playwright/test": "^1.55.0",
"@types/node": "^24.3.0",
"dotenv": "17.2.1",
"@types/node": "^24.3.1",
"dotenv": "17.2.2",
"node-html-parser": "^7.0.1",
"totp-generator": "^1.0.0"
}

View File

@@ -126,7 +126,7 @@ test.describe('Admin', () => {
page.waitForResponse(
(response) =>
response.url().includes('/admin/accounts') &&
response.status() === 200,
response.request().method() === 'POST',
),
]);
@@ -172,10 +172,12 @@ test.describe('Admin', () => {
page.waitForResponse(
(response) =>
response.url().includes('/admin/accounts') &&
response.status() === 200,
response.request().method() === 'POST',
),
]);
await page.waitForTimeout(250);
// Verify ban badge is removed
await expect(page.getByText('Banned')).not.toBeVisible();
@@ -388,14 +390,17 @@ async function filterAccounts(page: Page, email: string) {
.fill(email);
await page.keyboard.press('Enter');
await page.waitForTimeout(500);
await page.waitForTimeout(250);
}
async function selectAccount(page: Page, email: string) {
await page
const link = page
.locator('tr', { hasText: email.split('@')[0] })
.locator('a')
.click();
.locator('a');
await expect(link).toBeVisible();
await link.click();
await page.waitForURL(new RegExp(`/admin/accounts/[a-z0-9-]+`));
await page.waitForTimeout(500);

View File

@@ -46,9 +46,12 @@ const config = {
resolveExtensions: ['.ts', '.tsx', '.js', '.jsx'],
resolveAlias: getModulesAliases(),
},
devIndicators: {
position: 'bottom-right',
},
devIndicators:
process.env.NEXT_PUBLIC_CI === 'true'
? false
: {
position: 'bottom-right',
},
experimental: {
mdxRs: true,
reactCompiler: ENABLE_REACT_COMPILER,
@@ -131,7 +134,6 @@ function getModulesAliases() {
// exclude the modules that are not needed
const excludeSentry = monitoringProvider !== 'sentry';
const excludeBaselime = monitoringProvider !== 'baselime';
const excludeStripe = billingProvider !== 'stripe';
const excludeNodemailer = mailerProvider !== 'nodemailer';
const excludeTurnstile = !captchaProvider;
@@ -146,10 +148,6 @@ function getModulesAliases() {
aliases['@sentry/nextjs'] = noopPath;
}
if (excludeBaselime) {
aliases['@baselime/react-rum'] = noopPath;
}
if (excludeStripe) {
aliases['stripe'] = noopPath;
aliases['@stripe/stripe-js'] = noopPath;

View File

@@ -54,10 +54,10 @@
"@makerkit/data-loader-supabase-core": "^0.0.10",
"@makerkit/data-loader-supabase-nextjs": "^1.2.5",
"@marsidev/react-turnstile": "^1.3.0",
"@nosecone/next": "1.0.0-beta.10",
"@nosecone/next": "1.0.0-beta.11",
"@radix-ui/react-icons": "^1.3.2",
"@supabase/supabase-js": "2.55.0",
"@tanstack/react-query": "5.85.5",
"@supabase/supabase-js": "2.57.2",
"@tanstack/react-query": "5.87.1",
"@tanstack/react-table": "^8.21.3",
"date-fns": "^4.1.0",
"lucide-react": "^0.542.0",
@@ -77,8 +77,8 @@
"@kit/prettier-config": "workspace:*",
"@kit/tsconfig": "workspace:*",
"@next/bundle-analyzer": "15.5.2",
"@tailwindcss/postcss": "^4.1.12",
"@types/node": "^24.3.0",
"@tailwindcss/postcss": "^4.1.13",
"@types/node": "^24.3.1",
"@types/react": "19.1.12",
"@types/react-dom": "19.1.9",
"babel-plugin-react-compiler": "19.1.0-rc.3",
@@ -86,7 +86,7 @@
"pino-pretty": "13.0.0",
"prettier": "^3.6.2",
"supabase": "2.39.2",
"tailwindcss": "4.1.12",
"tailwindcss": "4.1.13",
"tailwindcss-animate": "^1.0.7",
"typescript": "^5.9.2"
},