Skip to content

Commit b09b70b

Browse files
AbhishekfmAbhishekfm
committed
NextJS updated to version 15
1 parent 44cc2fb commit b09b70b

File tree

16 files changed

+804
-1060
lines changed

16 files changed

+804
-1060
lines changed

‎app/[locale]/[state]/analytics/components/chart-view.tsx‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -168,6 +168,9 @@ export const ChartView = ({
168168
// next: {
169169
// tags: ['chart-data'],
170170
// }
171+
// -----------
172+
173+
// cache: 'no-store', // Prevent caching for dynamic data
171174
}
172175
)
173176
.then((response) => response.json())

‎app/[locale]/[state]/analytics/components/filter-dropdown-options.tsx‎

Lines changed: 22 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@ export interface Option {
99
disabled?: boolean;
1010
value: string;
1111
label: string;
12-
districtCode?: string;
12+
districtCode?: string; // extra field we don’t want leaking into DOM
1313
}
1414

1515
export default function FilterDropdownOptions({
@@ -32,13 +32,19 @@ export default function FilterDropdownOptions({
3232
const [revenueCode, setRevenueCode] = useQueryState('revenue-code');
3333

3434
const getRevenueCircleOptionsForDistrict = (districtCode: string) => {
35-
const filterRevenueCircles = RevCircleDropdownOptions.filter(
35+
return RevCircleDropdownOptions.filter(
3636
(option: Option) => option.districtCode === districtCode
3737
);
38-
39-
return filterRevenueCircles;
4038
};
4139

40+
// helper: strip out custom props like districtCode
41+
const sanitizeOptions = (options: Option[]) =>
42+
options.map(({ value, label, disabled }) => ({
43+
value,
44+
label,
45+
disabled,
46+
}));
47+
4248
let minDate, maxDate;
4349
// Below is code to set limits to the calendar
4450
if (timeLimits.data) {
@@ -59,26 +65,24 @@ export default function FilterDropdownOptions({
5965
const [selectedTimePeriod, setSelectedTimePeriod] = useQueryState<string[]>(
6066
'time-period',
6167
{
62-
parse: (value) => {
63-
return value.split(',');
64-
},
68+
parse: (value) => value.split(','),
6569
}
6670
);
6771

68-
const districtOptions = [
72+
const districtOptions = sanitizeOptions([
6973
{ label: 'Select a district', value: '' },
7074
...DistrictDropDownOption,
71-
];
75+
]);
7276

73-
const revenueOptions = [
77+
const revenueOptions = sanitizeOptions([
7478
{
7579
label: !districtCode
7680
? 'Select a district to enable'
7781
: `Select a ${toTitleCase(currentSelectedState.child_type)}`,
7882
value: '',
7983
},
8084
...(getRevenueCircleOptionsForDistrict(districtCode) || []),
81-
];
85+
]);
8286

8387
return (
8488
<div>
@@ -94,6 +98,7 @@ export default function FilterDropdownOptions({
9498
}}
9599
options={districtOptions}
96100
/>
101+
97102
<Select
98103
label={`Select ${toTitleCase(currentSelectedState.child_type)}`}
99104
value={revenueCode || ''}
@@ -127,7 +132,9 @@ export default function FilterDropdownOptions({
127132
setSelectedTimePeriod(
128133
dates.map(
129134
(date: any) =>
130-
`${date.year}_${date.month < 10 ? `0${date.month}` : `${date.month}`}`
135+
`${date.year}_${
136+
date.month < 10 ? `0${date.month}` : `${date.month}`
137+
}`
131138
)
132139
);
133140
}}
@@ -149,7 +156,9 @@ export default function FilterDropdownOptions({
149156
onChange={(date: any) => {
150157
setSelectedTimePeriod(
151158
[
152-
`${date.year}_${date.month < 10 ? `0${date.month}` : `${date.month}`}`,
159+
`${date.year}_${
160+
date.month < 10 ? `0${date.month}` : `${date.month}`
161+
}`,
153162
],
154163
{ shallow: false }
155164
);

‎app/[locale]/[state]/analytics/components/map-component.tsx‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -46,6 +46,7 @@ export const MapComponent = ({
4646
const [mapFeatures, setMapFeatures] = React.useState<any>(mapData.features);
4747

4848
const params = new URLSearchParams(window.location.search);
49+
console.log('params', params.get('district-code'));
4950
const districtCode = params.get('district-code');
5051

5152
const { width } = useWindowSize();
@@ -281,6 +282,7 @@ export const MapComponent = ({
281282
return (
282283
<>
283284
{' '}
285+
{/* "react-leaflet": "^4.2.1", */}
284286
{/* <div
285287
className={`relative w-full ${isMobile ? 'h-full' : 'h-[98%]'} ${isMobile ? 'pt-[68px]' : ''}`}
286288
> */}

‎app/[locale]/[state]/analytics/components/styles.module.scss‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,10 +5,10 @@
55
transition: transform var(--duration-400) ease 0s;
66
}
77
.FactorList {
8+
margin-bottom: 18px;
89
@media (max-width: 1280px) {
910
overflow: hidden;
1011
}
11-
margin-bottom: 18px;
1212
}
1313

1414
.Overlay {

‎app/[locale]/[state]/analytics/layout.tsx‎

Lines changed: 4 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
import React, { cache } from 'react';
2-
import { useQuery } from '@tanstack/react-query';
32

43
import { PLATFORM_STATES_LIST } from '@/config/graphql/analaytics-queries';
54
import { getQueryClient, GraphQL } from '@/lib/api';
@@ -28,16 +27,16 @@ export default async function AnalyticsLayout({
2827
params,
2928
}: {
3029
children: React.ReactNode;
31-
params: { state: string };
30+
params: Promise<{ state: string }>;
3231
}) {
32+
const resolvedParams = await params;
33+
const state = resolvedParams.state;
3334
const statesListData = await getStatesList();
3435

3536
return (
3637
<>
3738
<AnalyticsSideBarLayout
38-
currentState={statesListData?.find(
39-
(item: any) => item.slug === params.state
40-
)}
39+
currentState={statesListData?.find((item: any) => item.slug === state)}
4140
statesList={statesListData}
4241
>
4342
{children}

‎app/[locale]/[state]/analytics/page.tsx‎

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -12,8 +12,9 @@ import { AnalyticsMainLayout } from './components/analytics-layout';
1212
export default async function Home({
1313
searchParams,
1414
}: {
15-
searchParams: { [key: string]: string };
15+
searchParams: Promise<{ [key: string]: string }>;
1616
}) {
17+
const searchParamsHome = await searchParams;
1718
const queryClient = getQueryClient();
1819

1920
try {
@@ -25,12 +26,12 @@ export default async function Home({
2526
);
2627

2728
await queryClient.prefetchQuery(
28-
[`indicators_${searchParams?.['indicator']}`],
29+
[`indicators_${searchParamsHome?.['indicator']}`],
2930
() =>
3031
GraphQL(
3132
`${process.env.DATA_MANAGEMENT_LAYER_URL}/graphql`,
3233
ANALYTICS_INDICATORS,
33-
{ indcFilter: { slug: searchParams?.['indicator'] } }
34+
{ indcFilter: { slug: searchParamsHome?.['indicator'] } }
3435
)
3536
);
3637

‎app/[locale]/layout.tsx‎

Lines changed: 10 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,7 @@ import { NextIntlClientProvider } from 'next-intl';
77
import { unstable_setRequestLocale } from 'next-intl/server';
88

99
import { mainConfig, siteConfig } from '@/config/site';
10+
import { getPrefLangCookie } from '@/lib/serverUtils';
1011
import { MainNav } from '@/components/main-nav';
1112
import { MediaRendering } from '@/components/media-rendering';
1213
import { MobileNav } from '@/components/mobile-nav';
@@ -56,18 +57,21 @@ export async function generateMetadata() {
5657
icon: '/favicon.ico',
5758
shortcut: '/favicon-16x16.png',
5859
apple: `${siteConfig.url}/apple-touch-icon.png`,
60+
// apple: '/apple-touch-icon.png',
5961
},
6062
manifest: `${siteConfig.url}/site.webmanifest`,
63+
// manifest: '/site.webmanifest',
6164
};
6265
}
6366

6467
export default async function LocaleLayout({
6568
children,
66-
params: { locale },
69+
params,
6770
}: {
6871
children: React.ReactNode;
69-
params: { locale: string };
72+
params: Promise<{ locale: string }>;
7073
}) {
74+
let locale = (await params).locale;
7175
let messages;
7276
try {
7377
messages = (await import(`../../locales/${locale}.json`)).default;
@@ -77,6 +81,9 @@ export default async function LocaleLayout({
7781
}
7882
unstable_setRequestLocale(locale);
7983

84+
// Get the language preference from cookies
85+
const prefLangCookie = await getPrefLangCookie();
86+
8087
return (
8188
<html lang={locale}>
8289
<head>
@@ -113,7 +120,7 @@ export default async function LocaleLayout({
113120
<MobileNav data={mainConfig} />
114121
</MediaRendering>
115122
<MediaRendering minWidth="1024" maxWidth={null}>
116-
<MainNav data={mainConfig} />
123+
<MainNav data={mainConfig} prefLangCookie={prefLangCookie} />
117124
</MediaRendering>
118125

119126
{children}

‎components/main-nav.tsx‎

Lines changed: 8 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -6,12 +6,17 @@ import { useKeyDetect } from '@/hooks/use-key-detect';
66
import { MainConfig } from '@/types';
77
import { Icon, Text } from 'opub-ui';
88

9-
import { getPrefLangCookie } from '@/lib/serverUtils';
109
import { Icons } from '@/components/icons';
1110
import { TranslateDropdown } from './langSelect/lang-select';
1211
import NavLink from './nav-link';
1312

14-
export function MainNav({ data }: { data: MainConfig }) {
13+
export function MainNav({
14+
data,
15+
prefLangCookie,
16+
}: {
17+
data: MainConfig;
18+
prefLangCookie: string;
19+
}) {
1520
const { key, metaKey } = useKeyDetect();
1621
const searchRef = React.useRef<HTMLInputElement>(null);
1722

@@ -51,7 +56,7 @@ export function MainNav({ data }: { data: MainConfig }) {
5156
</div>
5257
)}
5358

54-
<TranslateDropdown prefLangCookie={getPrefLangCookie()} />
59+
<TranslateDropdown prefLangCookie={prefLangCookie} />
5560
</div>
5661
</div>
5762
</header>

‎i18n.ts‎

Lines changed: 5 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -4,14 +4,17 @@ import { getRequestConfig } from 'next-intl/server';
44

55
import locales from './config/locales';
66

7-
export default getRequestConfig(async ({ locale }) => {
7+
export default getRequestConfig(async ({ requestLocale }) => {
88
// Validate that the incoming `locale` parameter is valid
9-
if (!locales.all.includes(locale as any)) {
9+
const locale = await requestLocale;
10+
11+
if (!locale || !locales.all.includes(locale as any)) {
1012
captureException('Locale Error');
1113
notFound();
1214
}
1315

1416
return {
17+
locale,
1518
messages: (await import(`./locales/${locale}.json`)).default,
1619
};
1720
});

‎lib/api.ts‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -42,6 +42,9 @@ export function useFetch(id: string, query: string) {
4242
queryFn: async () => {
4343
try {
4444
const data = await fetch(query).then((res) => res.json());
45+
// const data = await fetch(query, { cache: 'no-store' }).then((res) =>
46+
// res.json()
47+
// );
4548
return data;
4649
} catch (error: any) {
4750
captureException(error);
@@ -67,6 +70,8 @@ export const fetchDatasets = async (variables: any) => {
6770
try {
6871
const response = await fetch(
6972
`${process.env.NEXT_PUBLIC_BACKEND_URL}/api/search/dataset/${variables}`
73+
// `${process.env.NEXT_PUBLIC_BACKEND_URL}/api/search/dataset/${variables}`,
74+
// { cache: 'no-store' }
7075
);
7176
const data = await response.json();
7277
return data;

0 commit comments

Comments
 (0)