Skip to content

Commit d760b22

Browse files
committed
fix(dash/src): 🐛 Keep url state on initial render, update mantine
1 parent 33ff600 commit d760b22

9 files changed

Lines changed: 208 additions & 291 deletions

File tree

apps/dashboard/package.json

Lines changed: 11 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -15,17 +15,17 @@
1515
"dependencies": {
1616
"@bte-germany/terraconvert": "^1.1.2",
1717
"@keycloak/keycloak-admin-client": "^26.2.0",
18-
"@mantine/charts": "^8.1.2",
19-
"@mantine/code-highlight": "^8.1.2",
20-
"@mantine/core": "^8.1.2",
21-
"@mantine/dates": "^8.1.2",
22-
"@mantine/form": "^8.1.2",
23-
"@mantine/hooks": "^8.1.2",
24-
"@mantine/modals": "^8.1.2",
25-
"@mantine/notifications": "^8.1.2",
26-
"@mantine/nprogress": "^8.1.2",
27-
"@mantine/spotlight": "^8.1.2",
28-
"@mantine/tiptap": "^8.1.2",
18+
"@mantine/charts": "^8.2.3",
19+
"@mantine/code-highlight": "^8.2.3",
20+
"@mantine/core": "^8.2.3",
21+
"@mantine/dates": "^8.2.3",
22+
"@mantine/form": "^8.2.3",
23+
"@mantine/hooks": "^8.2.3",
24+
"@mantine/modals": "^8.2.3",
25+
"@mantine/notifications": "^8.2.3",
26+
"@mantine/nprogress": "^8.2.3",
27+
"@mantine/spotlight": "^8.2.3",
28+
"@mantine/tiptap": "^8.2.3",
2929
"@mapbox/mapbox-gl-draw": "^1.5.0",
3030
"@repo/db": "*",
3131
"@tabler/icons-react": "^3.9.0",

apps/dashboard/src/app/(sideNavbar)/am/applications/interactivity.tsx

Lines changed: 12 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -8,15 +8,15 @@ import { useEffect, useState } from 'react';
88
import { useDebouncedValue } from '@mantine/hooks';
99

1010
export function SearchApplications(props: GroupProps) {
11-
const [searchValue, setSearchValue] = useState('');
12-
const [searchType, setSearchType] = useState('applicant');
13-
const [onlyPending, setOnlyPending] = useState(false);
14-
15-
const [debouncedValue] = useDebouncedValue(searchValue, 500);
1611
const router = useRouter();
1712
const params = useSearchParams();
1813
const pathname = usePathname();
1914

15+
const [searchValue, setSearchValue] = useState(() => params.get('query') || '');
16+
const [searchType, setSearchType] = useState(() => params.get('searchType') || 'applicant');
17+
const [onlyPending, setOnlyPending] = useState(() => params.get('onlyPending') === 'true');
18+
const [debouncedValue] = useDebouncedValue(searchValue, 500);
19+
2020
const searchTypes = [
2121
{
2222
value: 'applicant',
@@ -36,18 +36,19 @@ export function SearchApplications(props: GroupProps) {
3636
];
3737

3838
useEffect(() => {
39-
if (
40-
debouncedValue != (params.get('query') || '') ||
41-
onlyPending != (params.get('onlyPending') === 'true') ||
42-
searchType != (params.get('searchType') || '')
43-
) {
39+
const currentQuery = params.get('query') || '';
40+
const currentType = params.get('searchType') || 'applicant';
41+
const currentPending = params.get('onlyPending') === 'true';
42+
if (debouncedValue !== currentQuery || searchType !== currentType || onlyPending !== currentPending) {
4443
if (debouncedValue) {
4544
router.push(`${pathname}?query=${debouncedValue}&searchType=${searchType}&onlyPending=${onlyPending}&page=1`);
4645
} else {
4746
router.push(`${pathname}?page=${params.get('page') || 1}`);
4847
}
4948
}
50-
}, [debouncedValue, onlyPending, searchType, params, pathname, router]);
49+
// Only run when debouncedValue, searchType, onlyPending, pathname, or router changes
50+
// eslint-disable-next-line react-hooks/exhaustive-deps
51+
}, [debouncedValue, searchType, onlyPending, pathname, router]);
5152

5253
return (
5354
<Group gap="sm" {...props} w="100%">

apps/dashboard/src/app/(sideNavbar)/am/claims/interactivity.tsx

Lines changed: 8 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -8,21 +8,25 @@ import { useEffect, useState } from 'react';
88
import { useDebouncedValue } from '@mantine/hooks';
99

1010
export function SearchClaims(props: TextInputProps) {
11-
const [value, setValue] = useState('');
12-
const [debounced] = useDebouncedValue(value, 500);
1311
const router = useRouter();
1412
const params = useSearchParams();
1513
const pathname = usePathname();
1614

15+
const [value, setValue] = useState(() => params.get('query') || '');
16+
const [debounced] = useDebouncedValue(value, 500);
17+
1718
useEffect(() => {
18-
if (debounced != (params.get('query') || '')) {
19+
const currentQuery = params.get('query') || '';
20+
if (debounced !== currentQuery) {
1921
if (debounced) {
2022
router.push(`${pathname}?query=${debounced}&page=1`);
2123
} else {
2224
router.push(`${pathname}?page=1`);
2325
}
2426
}
25-
}, [debounced, params, pathname, router]);
27+
// Only run when debounced, pathname, or router changes
28+
// eslint-disable-next-line react-hooks/exhaustive-deps
29+
}, [debounced, pathname, router]);
2630

2731
return (
2832
<TextInput

apps/dashboard/src/app/(sideNavbar)/am/teams/interactivity.tsx

Lines changed: 8 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -8,21 +8,25 @@ import { useEffect, useState } from 'react';
88
import { useDebouncedValue } from '@mantine/hooks';
99

1010
export function SearchBuildTeams(props: TextInputProps) {
11-
const [value, setValue] = useState('');
12-
const [debounced] = useDebouncedValue(value, 500);
1311
const router = useRouter();
1412
const params = useSearchParams();
1513
const pathname = usePathname();
1614

15+
const [value, setValue] = useState(() => params.get('query') || '');
16+
const [debounced] = useDebouncedValue(value, 500);
17+
1718
useEffect(() => {
18-
if (debounced != (params.get('query') || '')) {
19+
const currentQuery = params.get('query') || '';
20+
if (debounced !== currentQuery) {
1921
if (debounced) {
2022
router.push(`${pathname}?query=${debounced}&page=1`);
2123
} else {
2224
router.push(`${pathname}?page=1`);
2325
}
2426
}
25-
}, [debounced, params, pathname, router]);
27+
// Only run when debounced, pathname, or router changes
28+
// eslint-disable-next-line react-hooks/exhaustive-deps
29+
}, [debounced, pathname, router]);
2630

2731
return (
2832
<TextInput

apps/dashboard/src/app/(sideNavbar)/am/users/[ssoId]/interactivity.tsx

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -72,6 +72,19 @@ export function UserMenu({ user }: { user: User }) {
7272
</ActionIcon>
7373
</MenuTarget>
7474
<MenuDropdown>
75+
<Menu.Sub position="left-start">
76+
<Menu.Sub.Target>
77+
<Menu.Sub.Item>Products</Menu.Sub.Item>
78+
</Menu.Sub.Target>
79+
80+
<Menu.Sub.Dropdown>
81+
<Menu.Item>All products</Menu.Item>
82+
<Menu.Item>Categories</Menu.Item>
83+
<Menu.Item>Tags</Menu.Item>
84+
<Menu.Item>Attributes</Menu.Item>
85+
<Menu.Item>Shipping classes</Menu.Item>
86+
</Menu.Sub.Dropdown>
87+
</Menu.Sub>
7588
<MenuLabel>Sessions</MenuLabel>
7689
<MenuItem>Close session...</MenuItem>
7790
<MenuItem>Close all sessions</MenuItem>

apps/dashboard/src/app/(sideNavbar)/am/users/interactivity.tsx

Lines changed: 8 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -8,21 +8,25 @@ import { useEffect, useState } from 'react';
88
import { useDebouncedValue } from '@mantine/hooks';
99

1010
export function SearchUsers(props: TextInputProps) {
11-
const [value, setValue] = useState('');
12-
const [debounced] = useDebouncedValue(value, 500);
1311
const router = useRouter();
1412
const params = useSearchParams();
1513
const pathname = usePathname();
1614

15+
const [value, setValue] = useState(() => params.get('query') || '');
16+
const [debounced] = useDebouncedValue(value, 500);
17+
1718
useEffect(() => {
18-
if (debounced != params.get('query') || '') {
19+
const currentQuery = params.get('query') || '';
20+
if (debounced !== currentQuery) {
1921
if (debounced) {
2022
router.push(`${pathname}?query=${debounced}&page=1`);
2123
} else {
2224
router.push(`${pathname}?page=1`);
2325
}
2426
}
25-
}, [debounced, params, pathname, router]);
27+
// Only run when debounced, pathname, or router changes
28+
// eslint-disable-next-line react-hooks/exhaustive-deps
29+
}, [debounced, pathname, router]);
2630

2731
return (
2832
<TextInput

apps/dashboard/src/app/(sideNavbar)/me/applications/interactivity.tsx

Lines changed: 8 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -8,21 +8,25 @@ import { useEffect, useState } from 'react';
88
import { useDebouncedValue } from '@mantine/hooks';
99

1010
export function SearchApplications(props: TextInputProps) {
11-
const [value, setValue] = useState('');
12-
const [debounced] = useDebouncedValue(value, 500);
1311
const router = useRouter();
1412
const params = useSearchParams();
1513
const pathname = usePathname();
1614

15+
const [value, setValue] = useState(() => params.get('query') || '');
16+
const [debounced] = useDebouncedValue(value, 500);
17+
1718
useEffect(() => {
18-
if (debounced != (params.get('query') || '')) {
19+
const currentQuery = params.get('query') || '';
20+
if (debounced !== currentQuery) {
1921
if (debounced) {
2022
router.push(`${pathname}?query=${debounced}&page=1`);
2123
} else {
2224
router.push(`${pathname}?page=1`);
2325
}
2426
}
25-
}, [debounced, params, pathname, router]);
27+
// Only run when debounced, pathname, or router changes
28+
// eslint-disable-next-line react-hooks/exhaustive-deps
29+
}, [debounced, pathname, router]);
2630

2731
return (
2832
<TextInput

apps/frontend/package.json

Lines changed: 11 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -17,18 +17,18 @@
1717
"@emotion/react": "^11.10.4",
1818
"@emotion/server": "^11.10.0",
1919
"@icons-pack/react-simple-icons": "^12.6.0",
20-
"@mantine/carousel": "7.17.4",
21-
"@mantine/core": "7.17.4",
22-
"@mantine/dates": "7.17.4",
23-
"@mantine/dropzone": "7.17.4",
24-
"@mantine/form": "7.17.4",
25-
"@mantine/hooks": "7.17.4",
26-
"@mantine/modals": "7.17.4",
20+
"@mantine/carousel": "^8.2.3",
21+
"@mantine/core": "^8.2.3",
22+
"@mantine/dates": "^8.2.3",
23+
"@mantine/dropzone": "^8.2.3",
24+
"@mantine/form": "^8.2.3",
25+
"@mantine/hooks": "^8.2.3",
26+
"@mantine/modals": "^8.2.3",
2727
"@mantine/next": "^6.0.22",
28-
"@mantine/notifications": "7.17.4",
29-
"@mantine/nprogress": "7.17.4",
30-
"@mantine/spotlight": "7.17.4",
31-
"@mantine/tiptap": "7.17.4",
28+
"@mantine/notifications": "^8.2.3",
29+
"@mantine/nprogress": "^8.2.3",
30+
"@mantine/spotlight": "^8.2.3",
31+
"@mantine/tiptap": "^8.2.3",
3232
"@mapbox/mapbox-gl-draw": "^1.4.3",
3333
"@react-three/fiber": "^8.10.1",
3434
"@tabler/icons-react": "^2.35.0",

0 commit comments

Comments
 (0)