From 32cad260427223499290acff382e09fbde620c95 Mon Sep 17 00:00:00 2001
From: Alessandro Kreslin <kalessandro14@gmail.com>
Date: Mon, 13 Jul 2026 09:35:17 -0400
Subject: [PATCH 1/5] eslint rules set 1

---
 eslint.config.mjs                                     | 11 ++++++++---
 .../account/notifications/AccountNotifications.tsx    |  4 +---
 .../complete-registration/CompleteRegistration.tsx    |  2 +-
 .../contribute/FeedSubmission/Form/FirstStep.tsx      |  6 +++++-
 .../contribute/FeedSubmission/Form/FourthStep.tsx     |  6 +++++-
 .../contribute/FeedSubmission/Form/SecondStep.tsx     |  6 +++++-
 .../FeedSubmission/Form/SecondStepRealtime.tsx        |  6 +++++-
 .../contribute/FeedSubmission/Form/ThirdStep.tsx      |  6 +++++-
 .../feeds/[feedDataType]/[feedId]/static/layout.tsx   |  4 ++--
 src/app/[locale]/layout.tsx                           |  2 +-
 src/app/api/revalidate/route.spec.ts                  |  6 +++---
 src/app/api/revalidate/route.ts                       |  2 +-
 src/app/api/session/route.ts                          |  4 ++--
 src/app/components/GtfsVisualizationMap.spec.tsx      |  2 +-
 src/app/components/Map/SelectedRoutesStopsPanel.tsx   |  2 +-
 src/app/components/ThemeToggle.tsx                    |  3 ++-
 .../Feed/components/NotificationSettingsDialog.tsx    |  4 +---
 src/app/screens/FeedSubmitted.tsx                     |  8 ++++++--
 src/app/screens/GbfsValidator/GbfsFeedSearchInput.tsx |  8 +++++---
 .../GbfsValidator/components/ErrorDetailsDialog.tsx   |  4 ++--
 src/app/services/api-auth-middleware.ts               |  2 +-
 src/app/services/profile-service.ts                   |  2 +-
 src/app/types.ts                                      |  6 +++---
 src/app/utils/precompute.ts                           |  8 +-------
 24 files changed, 68 insertions(+), 46 deletions(-)

diff --git a/eslint.config.mjs b/eslint.config.mjs
index aa94178c..481e88af 100644
--- a/eslint.config.mjs
+++ b/eslint.config.mjs
@@ -61,10 +61,15 @@ export default tseslint.config(
       '@typescript-eslint/no-unsafe-call': 'off',
       '@typescript-eslint/no-unsafe-return': 'off',
       '@typescript-eslint/no-unsafe-enum-comparison': 'off',
-      '@typescript-eslint/no-unnecessary-type-assertion': 'off',
-      '@typescript-eslint/no-redundant-type-constituents': 'off',
+    },
+  },
+  {
+    // Test files: `async` test callbacks and `act(async () => {})` wrappers are
+    // idiomatic even when they contain no `await` (async `act` flushes the
+    // microtask queue). Relaxing require-await here avoids churn in test infra.
+    files: ['**/*.spec.{ts,tsx}', '**/*.test.{ts,tsx}'],
+    rules: {
       '@typescript-eslint/require-await': 'off',
-      '@typescript-eslint/no-misused-promises': 'off',
     },
   },
   prettierRecommended,
diff --git a/src/app/[locale]/account/notifications/AccountNotifications.tsx b/src/app/[locale]/account/notifications/AccountNotifications.tsx
index 499a05c6..79dd909c 100644
--- a/src/app/[locale]/account/notifications/AccountNotifications.tsx
+++ b/src/app/[locale]/account/notifications/AccountNotifications.tsx
@@ -315,9 +315,7 @@ export default function AccountNotifications(): React.ReactElement {
             <Select
               value={defaultFrequency}
               onChange={(e) => {
-                setDefaultFrequency(
-                  e.target.value as NotificationSettings['frequency'],
-                );
+                setDefaultFrequency(e.target.value);
               }}
               size='small'
             >
diff --git a/src/app/[locale]/complete-registration/CompleteRegistration.tsx b/src/app/[locale]/complete-registration/CompleteRegistration.tsx
index 2d84892d..e2615cd2 100644
--- a/src/app/[locale]/complete-registration/CompleteRegistration.tsx
+++ b/src/app/[locale]/complete-registration/CompleteRegistration.tsx
@@ -86,7 +86,7 @@ export default function CompleteRegistration(): React.ReactElement {
     validationSchema: CompleteRegistrationSchema,
     validateOnChange: isSubmitted,
     validateOnBlur: true,
-    onSubmit: async (values) => {
+    onSubmit: (values) => {
       if (user != null) {
         dispatch(
           refreshUserInformation({
diff --git a/src/app/[locale]/contribute/FeedSubmission/Form/FirstStep.tsx b/src/app/[locale]/contribute/FeedSubmission/Form/FirstStep.tsx
index a203f336..35893604 100644
--- a/src/app/[locale]/contribute/FeedSubmission/Form/FirstStep.tsx
+++ b/src/app/[locale]/contribute/FeedSubmission/Form/FirstStep.tsx
@@ -107,7 +107,11 @@ export default function FormFirstStep({
 
   return (
     <>
-      <form onSubmit={handleSubmit(onSubmit)}>
+      <form
+        onSubmit={(e) => {
+          void handleSubmit(onSubmit)(e);
+        }}
+      >
         <Grid container direction={'column'} rowSpacing={2}>
           <Grid>
             <FormControl
diff --git a/src/app/[locale]/contribute/FeedSubmission/Form/FourthStep.tsx b/src/app/[locale]/contribute/FeedSubmission/Form/FourthStep.tsx
index 1bad0857..385ddc5d 100644
--- a/src/app/[locale]/contribute/FeedSubmission/Form/FourthStep.tsx
+++ b/src/app/[locale]/contribute/FeedSubmission/Form/FourthStep.tsx
@@ -67,7 +67,11 @@ export default function FormFourthStep({
 
   return (
     <>
-      <form onSubmit={handleSubmit(onSubmit)}>
+      <form
+        onSubmit={(e) => {
+          void handleSubmit(onSubmit)(e);
+        }}
+      >
         <Grid container direction={'column'} rowSpacing={2}>
           <Grid>
             <FormControl component='fieldset' fullWidth>
diff --git a/src/app/[locale]/contribute/FeedSubmission/Form/SecondStep.tsx b/src/app/[locale]/contribute/FeedSubmission/Form/SecondStep.tsx
index 76fccaa4..2e5ba37f 100644
--- a/src/app/[locale]/contribute/FeedSubmission/Form/SecondStep.tsx
+++ b/src/app/[locale]/contribute/FeedSubmission/Form/SecondStep.tsx
@@ -59,7 +59,11 @@ export default function FormSecondStep({
   return (
     <>
       <Typography gutterBottom>{t('gtfsScheduleFeed')}</Typography>
-      <form onSubmit={handleSubmit(onSubmit)}>
+      <form
+        onSubmit={(e) => {
+          void handleSubmit(onSubmit)(e);
+        }}
+      >
         <Grid container direction={'column'} rowSpacing={2}>
           <Grid>
             <FormControl
diff --git a/src/app/[locale]/contribute/FeedSubmission/Form/SecondStepRealtime.tsx b/src/app/[locale]/contribute/FeedSubmission/Form/SecondStepRealtime.tsx
index c062e5e8..525c1e0d 100644
--- a/src/app/[locale]/contribute/FeedSubmission/Form/SecondStepRealtime.tsx
+++ b/src/app/[locale]/contribute/FeedSubmission/Form/SecondStepRealtime.tsx
@@ -111,7 +111,11 @@ export default function FormSecondStepRT({
       >
         {t('gtfsRealtimeFeed')}
       </Typography>
-      <form onSubmit={handleSubmit(onSubmit)}>
+      <form
+        onSubmit={(e) => {
+          void handleSubmit(onSubmit)(e);
+        }}
+      >
         <Grid container direction={'column'} rowSpacing={2}>
           <Grid>
             <FormControl
diff --git a/src/app/[locale]/contribute/FeedSubmission/Form/ThirdStep.tsx b/src/app/[locale]/contribute/FeedSubmission/Form/ThirdStep.tsx
index 66b94782..357f380d 100644
--- a/src/app/[locale]/contribute/FeedSubmission/Form/ThirdStep.tsx
+++ b/src/app/[locale]/contribute/FeedSubmission/Form/ThirdStep.tsx
@@ -74,7 +74,11 @@ export default function FormThirdStep({
 
   return (
     <>
-      <form onSubmit={handleSubmit(onSubmit)}>
+      <form
+        onSubmit={(e) => {
+          void handleSubmit(onSubmit)(e);
+        }}
+      >
         <Grid container direction={'column'} rowSpacing={2}>
           {/* Show required emptyLicenseUsage if official producer and no license provided */}
           {isOfficialProducer && noLicenseProvided && (
diff --git a/src/app/[locale]/feeds/[feedDataType]/[feedId]/static/layout.tsx b/src/app/[locale]/feeds/[feedDataType]/[feedId]/static/layout.tsx
index 2beedda2..7d92a7dd 100644
--- a/src/app/[locale]/feeds/[feedDataType]/[feedId]/static/layout.tsx
+++ b/src/app/[locale]/feeds/[feedDataType]/[feedId]/static/layout.tsx
@@ -24,9 +24,9 @@ interface Props {
  * from the clean URLs like /feeds/gtfs/mdb-123.
  * TODO: Now that legacy catch-all route is removed, change this to a private route `_static` and update proxy and links accordingly.
  */
-export default async function StaticFeedLayout({
+export default function StaticFeedLayout({
   children,
   params,
-}: Props): Promise<React.ReactElement> {
+}: Props): React.ReactElement {
   return <>{children}</>;
 }
diff --git a/src/app/[locale]/layout.tsx b/src/app/[locale]/layout.tsx
index 03610522..93b769e0 100644
--- a/src/app/[locale]/layout.tsx
+++ b/src/app/[locale]/layout.tsx
@@ -84,7 +84,7 @@ export default async function LocaleLayout({
   }
 
   // At this point, locale is guaranteed to be a valid Locale type
-  const validLocale = locale as Locale;
+  const validLocale = locale;
 
   // Enable static rendering for this locale
   setRequestLocale(validLocale);
diff --git a/src/app/api/revalidate/route.spec.ts b/src/app/api/revalidate/route.spec.ts
index 913aba2f..15509aac 100644
--- a/src/app/api/revalidate/route.spec.ts
+++ b/src/app/api/revalidate/route.spec.ts
@@ -43,7 +43,7 @@ describe('GET /api/revalidate', () => {
       },
     });
 
-    const response = await GET(request);
+    const response = GET(request);
     const json = await response.json();
 
     expect(response.status).toBe(500);
@@ -65,7 +65,7 @@ describe('GET /api/revalidate', () => {
       },
     });
 
-    const response = await GET(request);
+    const response = GET(request);
     const json = await response.json();
 
     expect(response.status).toBe(401);
@@ -87,7 +87,7 @@ describe('GET /api/revalidate', () => {
       },
     });
 
-    const response = await GET(request);
+    const response = GET(request);
     const json = await response.json();
 
     expect(response.status).toBe(200);
diff --git a/src/app/api/revalidate/route.ts b/src/app/api/revalidate/route.ts
index 1ffa841d..b004953e 100644
--- a/src/app/api/revalidate/route.ts
+++ b/src/app/api/revalidate/route.ts
@@ -36,7 +36,7 @@ const defaultRevalidateOptions: RevalidateBody = {
  * Vercel automatically passes Authorization: Bearer <CRON_SECRET> with each invocation.
  * Configured in vercel.json under "crons" for 4am UTC Monday-Saturday and 7am UTC Sunday.
  */
-export async function GET(req: Request): Promise<NextResponse> {
+export function GET(req: Request): NextResponse {
   const authHeader = req.headers.get('authorization');
   const cronSecret = process.env.CRON_SECRET;
 
diff --git a/src/app/api/session/route.ts b/src/app/api/session/route.ts
index c7cc109b..258f7972 100644
--- a/src/app/api/session/route.ts
+++ b/src/app/api/session/route.ts
@@ -62,7 +62,7 @@ export async function POST(req: NextRequest): Promise<NextResponse> {
   }
 }
 
-export async function GET(req: NextRequest): Promise<NextResponse> {
+export function GET(req: NextRequest): NextResponse {
   try {
     const cookie = req.cookies.get(COOKIE_NAME)?.value;
     if (cookie == null) {
@@ -88,7 +88,7 @@ export async function GET(req: NextRequest): Promise<NextResponse> {
   }
 }
 
-export async function DELETE(req: NextRequest): Promise<NextResponse> {
+export function DELETE(req: NextRequest): NextResponse {
   // Clear the session cookie so that subsequent requests have no session.
   const response = NextResponse.json({ status: 'logged_out' });
   // Use the built-in delete helper to ensure the cookie is removed.
diff --git a/src/app/components/GtfsVisualizationMap.spec.tsx b/src/app/components/GtfsVisualizationMap.spec.tsx
index 4e61e0b8..db030ed2 100644
--- a/src/app/components/GtfsVisualizationMap.spec.tsx
+++ b/src/app/components/GtfsVisualizationMap.spec.tsx
@@ -94,7 +94,7 @@ describe('generateStopColorExpression', () => {
 
 describe('generateRouteOutlineColorExpression', () => {
   // Helper to safely index into nested unknown arrays
-  type NestedArr = Array<unknown | NestedArr>;
+  type NestedArr = unknown[];
   const at = (arr: NestedArr, ...indices: number[]): NestedArr =>
     indices.reduce<NestedArr>((a, i) => (a as NestedArr[])[i], arr);
   it('returns an array expression starting with "let" and "rgba"', () => {
diff --git a/src/app/components/Map/SelectedRoutesStopsPanel.tsx b/src/app/components/Map/SelectedRoutesStopsPanel.tsx
index 4a259624..bbfe374c 100644
--- a/src/app/components/Map/SelectedRoutesStopsPanel.tsx
+++ b/src/app/components/Map/SelectedRoutesStopsPanel.tsx
@@ -79,7 +79,7 @@ export const SelectedRoutesStopsPanel = (
                 key={s.stopId}
                 role='button'
                 tabIndex={0}
-                aria-selected={isActive ? 'true' : 'false'}
+                aria-pressed={isActive ? 'true' : 'false'}
                 onClick={() => {
                   focusStopFromPanel(s);
                 }}
diff --git a/src/app/components/ThemeToggle.tsx b/src/app/components/ThemeToggle.tsx
index b1ec9cd4..24e246de 100644
--- a/src/app/components/ThemeToggle.tsx
+++ b/src/app/components/ThemeToggle.tsx
@@ -2,13 +2,14 @@ import { IconButton } from '@mui/material';
 import Brightness4Icon from '@mui/icons-material/Brightness4';
 import Brightness7Icon from '@mui/icons-material/Brightness7';
 import { useTheme } from '../context/ThemeProvider';
+import { ThemeModeEnum } from '../Theme';
 
 const ThemeToggle = (): React.ReactElement => {
   const { mode, toggleTheme } = useTheme();
 
   return (
     <IconButton onClick={toggleTheme} color='inherit' aria-label='Theme Toggle'>
-      {mode === 'dark' ? <Brightness7Icon /> : <Brightness4Icon />}
+      {mode === ThemeModeEnum.dark ? <Brightness7Icon /> : <Brightness4Icon />}
     </IconButton>
   );
 };
diff --git a/src/app/screens/Feed/components/NotificationSettingsDialog.tsx b/src/app/screens/Feed/components/NotificationSettingsDialog.tsx
index 637e8f44..75b7d8f6 100644
--- a/src/app/screens/Feed/components/NotificationSettingsDialog.tsx
+++ b/src/app/screens/Feed/components/NotificationSettingsDialog.tsx
@@ -121,9 +121,7 @@ export default function NotificationSettingsDialog({
             <Select
               value={frequency}
               onChange={(e) => {
-                setFrequency(
-                  e.target.value as NotificationSettings['frequency'],
-                );
+                setFrequency(e.target.value);
               }}
               size='small'
             >
diff --git a/src/app/screens/FeedSubmitted.tsx b/src/app/screens/FeedSubmitted.tsx
index 6cfa7427..8e265c63 100644
--- a/src/app/screens/FeedSubmitted.tsx
+++ b/src/app/screens/FeedSubmitted.tsx
@@ -1,6 +1,7 @@
 'use client';
 
 import { Typography, Box, Container, useTheme, Button } from '@mui/material';
+import Image from 'next/image';
 
 export default function FeedSubmitted(): React.ReactElement {
   const theme = useTheme();
@@ -21,10 +22,13 @@ export default function FeedSubmitted(): React.ReactElement {
         🚀 Your feed has been submitted!
       </Typography>
       <Box sx={{ display: 'flex', flexDirection: 'row', p: 2 }}>
-        <img
+        <Image
           src='/assets/rocket.gif'
           alt='rocket'
-          style={{ width: '300px', height: '300px', marginRight: '60px' }}
+          width={300}
+          height={300}
+          unoptimized
+          style={{ marginRight: '60px' }}
         />
         <Box sx={{ maxWidth: '615px', justifyContent: 'center' }}>
           <Typography variant='body1' sx={{ mb: 2, fontSize: '20px' }}>
diff --git a/src/app/screens/GbfsValidator/GbfsFeedSearchInput.tsx b/src/app/screens/GbfsValidator/GbfsFeedSearchInput.tsx
index 3fa621d3..cb821691 100644
--- a/src/app/screens/GbfsValidator/GbfsFeedSearchInput.tsx
+++ b/src/app/screens/GbfsValidator/GbfsFeedSearchInput.tsx
@@ -37,7 +37,7 @@ export default function GbfsFeedSearchInput({
     initialFeedUrl ?? '',
   );
   const [requiresAuth, setRequiresAuth] = useState(false);
-  const [authType, setAuthType] = useState<string>('');
+  const [authType, setAuthType] = useState<AuthTypeEnum | ''>('');
   const [basicAuthUsername, setBasicAuthUsername] = useState<
     string | undefined
   >(undefined);
@@ -65,7 +65,9 @@ export default function GbfsFeedSearchInput({
   // Used to keep the auth inputs up to date
   useEffect(() => {
     setRequiresAuth(auth !== undefined);
-    setAuthType(auth == undefined ? '' : (auth.authType ?? ''));
+    setAuthType(
+      auth == undefined ? '' : ((auth.authType as AuthTypeEnum) ?? ''),
+    );
     setBasicAuthUsername(
       auth != null && 'username' in auth ? auth.username : undefined,
     );
@@ -91,7 +93,7 @@ export default function GbfsFeedSearchInput({
   };
 
   const handleAuthTypeChange = (event: SelectChangeEvent<string>): void => {
-    setAuthType(event.target.value);
+    setAuthType(event.target.value as AuthTypeEnum);
     setBasicAuthUsername(undefined);
     setBasicAuthPassword(undefined);
     setBearerAuthValue(undefined);
diff --git a/src/app/screens/GbfsValidator/components/ErrorDetailsDialog.tsx b/src/app/screens/GbfsValidator/components/ErrorDetailsDialog.tsx
index e045892e..de866a11 100644
--- a/src/app/screens/GbfsValidator/components/ErrorDetailsDialog.tsx
+++ b/src/app/screens/GbfsValidator/components/ErrorDetailsDialog.tsx
@@ -431,7 +431,7 @@ export function ErrorDetailsDialog({
                                     </Box>
                                   )}
                                   {renderHighlightedObject(
-                                    parentContextData as JSONValue,
+                                    parentContextData,
                                     null,
                                     null,
                                   )}
@@ -439,7 +439,7 @@ export function ErrorDetailsDialog({
                               );
                             }
                             return renderHighlightedObject(
-                              parentContextData as JSONValue,
+                              parentContextData,
                               lastPointerSegment ?? null,
                               lastArrayIndex,
                             );
diff --git a/src/app/services/api-auth-middleware.ts b/src/app/services/api-auth-middleware.ts
index d83ba77b..1f30c393 100644
--- a/src/app/services/api-auth-middleware.ts
+++ b/src/app/services/api-auth-middleware.ts
@@ -25,7 +25,7 @@ export const generateAuthMiddlewareWithToken = (
   userContextJwt?: string,
 ): Middleware => {
   return {
-    async onRequest(req) {
+    onRequest(req) {
       // Always attach the bearer token for IAP/GCIP.
       req.headers.set('Authorization', `Bearer ${accessToken}`);
 
diff --git a/src/app/services/profile-service.ts b/src/app/services/profile-service.ts
index 1835d51f..481c32b1 100644
--- a/src/app/services/profile-service.ts
+++ b/src/app/services/profile-service.ts
@@ -22,7 +22,7 @@ export const sendEmailVerification = async (): Promise<void> => {
 /**
  * Return the current user or null if the user is not logged in.
  */
-export const getUserFromSession = async (): Promise<User | null> => {
+export const getUserFromSession = (): User | null => {
   const currentUser = app.auth().currentUser;
   if (currentUser === null) {
     return null;
diff --git a/src/app/types.ts b/src/app/types.ts
index 5c196f87..a6560598 100644
--- a/src/app/types.ts
+++ b/src/app/types.ts
@@ -78,19 +78,19 @@ export enum LicenseErrorSource {
 }
 
 export interface ProfileError {
-  code: string | 'unknown';
+  code: string;
   message: string;
   source?: ProfileErrorSource;
 }
 
 export interface FeedError {
-  code: string | 'unknown';
+  code: string;
   message: string;
   source?: FeedErrorSource;
 }
 
 export interface LicenseError {
-  code: string | 'unknown';
+  code: string;
   message: string;
   source?: LicenseErrorSource;
 }
diff --git a/src/app/utils/precompute.ts b/src/app/utils/precompute.ts
index 62bce45e..83490aad 100644
--- a/src/app/utils/precompute.ts
+++ b/src/app/utils/precompute.ts
@@ -42,13 +42,7 @@ export interface PrecomputeDeps {
 
 /** Small helper: wait once for a map event */
 async function once(map: maplibregl.Map, ev: string): Promise<void> {
-  await new Promise<void>(
-    // eslint-disable-next-line no-async-promise-executor
-    async (resolve) =>
-      await map.once(ev, () => {
-        resolve();
-      }),
-  );
+  await map.once(ev);
 }
 
 // Extend helpers for [minLng,minLat,maxLng,maxLat]

From 979a71eec8fe8a271513b26d15fce341e5098abb Mon Sep 17 00:00:00 2001
From: Alessandro Kreslin <kalessandro14@gmail.com>
Date: Mon, 13 Jul 2026 09:50:47 -0400
Subject: [PATCH 2/5] eslint enable react-hooks/rules-of-hooks

---
 eslint.config.mjs                             |  3 --
 .../GBFSFeedAnalytics/DetailPanel.tsx         | 40 ++++++++---------
 .../GBFSNoticeAnalytics.tsx                   |  2 +-
 .../GBFSVersionAnalytics.tsx                  |  2 +-
 .../GTFSFeatureAnalytics.tsx                  |  2 +-
 .../GTFSNoticeAnalytics.tsx                   |  2 +-
 .../Feed/components/AssociatedFeeds.tsx       |  8 ++--
 src/app/screens/Feeds/SearchTable.spec.tsx    |  6 +--
 src/app/screens/Feeds/SearchTable.tsx         | 45 ++++++++++---------
 9 files changed, 55 insertions(+), 55 deletions(-)

diff --git a/eslint.config.mjs b/eslint.config.mjs
index 481e88af..af5b8b4c 100644
--- a/eslint.config.mjs
+++ b/eslint.config.mjs
@@ -41,9 +41,6 @@ export default tseslint.config(
           ignoreRestSiblings: true,
         },
       ],
-      // TODO: hooks called inside render callbacks, incorrect hook usage patterns,
-      // and missing/extra effect dependencies — to be fixed in a separate ticket.
-      'react-hooks/rules-of-hooks': 'off',
       'react-hooks/refs': 'off',
       'react-hooks/set-state-in-render': 'off',
       'react-hooks/set-state-in-effect': 'off',
diff --git a/src/app/[locale]/metrics/_components/Analytics/GBFSFeedAnalytics/DetailPanel.tsx b/src/app/[locale]/metrics/_components/Analytics/GBFSFeedAnalytics/DetailPanel.tsx
index d04b36f1..82fe022f 100644
--- a/src/app/[locale]/metrics/_components/Analytics/GBFSFeedAnalytics/DetailPanel.tsx
+++ b/src/app/[locale]/metrics/_components/Analytics/GBFSFeedAnalytics/DetailPanel.tsx
@@ -32,26 +32,6 @@ const DetailPanel: React.FC<RenderDetailPanelProps> = ({ row }) => {
   const theme = useTheme();
   const { notices, metrics } = row.original;
 
-  if (metrics == null) {
-    return <div>No metrics available</div>;
-  }
-
-  const chartData = metrics.computed_on.map((date, index) => {
-    const utcDate = new Date(date).toLocaleDateString('en-CA', {
-      timeZone: 'UTC',
-    }); // Converts the date to UTC
-
-    return {
-      date: utcDate,
-      count: metrics.errors_count[index],
-    };
-  });
-
-  const domain = [
-    new Date(chartData[0]?.date ?? '').getTime(),
-    new Date().getTime(),
-  ];
-
   // Define the columns for the notices table
   const columns = useMemo<Array<MRT_ColumnDef<GBFSNotice>>>(
     () => [
@@ -91,6 +71,26 @@ const DetailPanel: React.FC<RenderDetailPanelProps> = ({ row }) => {
     muiTableContainerProps: { sx: { maxHeight: '50vh' } },
   });
 
+  if (metrics == null) {
+    return <div>No metrics available</div>;
+  }
+
+  const chartData = metrics.computed_on.map((date, index) => {
+    const utcDate = new Date(date).toLocaleDateString('en-CA', {
+      timeZone: 'UTC',
+    }); // Converts the date to UTC
+
+    return {
+      date: utcDate,
+      count: metrics.errors_count[index],
+    };
+  });
+
+  const domain = [
+    new Date(chartData[0]?.date ?? '').getTime(),
+    new Date().getTime(),
+  ];
+
   return (
     <Grid container spacing={3} sx={{ maxWidth: '1200px' }}>
       <Grid size={{ xs: 12, md: 8 }}>
diff --git a/src/app/[locale]/metrics/_components/Analytics/GBFSNoticeAnalytics/GBFSNoticeAnalytics.tsx b/src/app/[locale]/metrics/_components/Analytics/GBFSNoticeAnalytics/GBFSNoticeAnalytics.tsx
index 1aefd028..f57f994d 100644
--- a/src/app/[locale]/metrics/_components/Analytics/GBFSNoticeAnalytics/GBFSNoticeAnalytics.tsx
+++ b/src/app/[locale]/metrics/_components/Analytics/GBFSNoticeAnalytics/GBFSNoticeAnalytics.tsx
@@ -32,6 +32,7 @@ export default function GBFSNoticeAnalytics(): React.ReactElement {
   const router = useRouter();
   const searchParams = useSearchParams();
   const noticeCode = searchParams.get('noticeCode');
+  const theme = useTheme();
   const [data, setData] = useState<GBFSNoticeMetrics[]>([]);
   const [loading, setLoading] = useState(true);
   const [error, setError] = useState<string | null>(null);
@@ -133,7 +134,6 @@ export default function GBFSNoticeAnalytics(): React.ReactElement {
     enableStickyFooter: true,
     muiTableContainerProps: { sx: { maxHeight: '70vh' } },
     renderDetailPanel: ({ row }) => {
-      const theme = useTheme();
       const metrics = row.original;
 
       const chartData = metrics.computed_on.map((date, index) => ({
diff --git a/src/app/[locale]/metrics/_components/Analytics/GBFSVersionAnalytics/GBFSVersionAnalytics.tsx b/src/app/[locale]/metrics/_components/Analytics/GBFSVersionAnalytics/GBFSVersionAnalytics.tsx
index 2ec10c29..17a208e0 100644
--- a/src/app/[locale]/metrics/_components/Analytics/GBFSVersionAnalytics/GBFSVersionAnalytics.tsx
+++ b/src/app/[locale]/metrics/_components/Analytics/GBFSVersionAnalytics/GBFSVersionAnalytics.tsx
@@ -39,6 +39,7 @@ import { GBFS_LINK } from '../../../../../constants/Navigation';
 
 export default function GBFSVersionAnalytics(): React.ReactElement {
   const router = useRouter();
+  const theme = useTheme();
   const [data, setData] = useState<GBFSVersionMetrics[]>([]);
   const [loading, setLoading] = useState(true);
   const [error, setError] = useState<string | null>(null);
@@ -157,7 +158,6 @@ export default function GBFSVersionAnalytics(): React.ReactElement {
     enableStickyFooter: true,
     muiTableContainerProps: { sx: { maxHeight: '70vh' } },
     renderDetailPanel: ({ row }) => {
-      const theme = useTheme();
       const metrics = row.original;
 
       const chartData = metrics.computed_on.map((date, index) => ({
diff --git a/src/app/[locale]/metrics/_components/Analytics/GTFSFeatureAnalytics/GTFSFeatureAnalytics.tsx b/src/app/[locale]/metrics/_components/Analytics/GTFSFeatureAnalytics/GTFSFeatureAnalytics.tsx
index 0e4260f3..b4525eb8 100644
--- a/src/app/[locale]/metrics/_components/Analytics/GTFSFeatureAnalytics/GTFSFeatureAnalytics.tsx
+++ b/src/app/[locale]/metrics/_components/Analytics/GTFSFeatureAnalytics/GTFSFeatureAnalytics.tsx
@@ -41,6 +41,7 @@ import {
 
 export default function GTFSFeatureAnalytics(): React.ReactElement {
   const router = useRouter();
+  const theme = useTheme();
   const searchParams = useSearchParams();
   const featureName = searchParams.get('featureName');
   const [data, setData] = useState<FeatureMetrics[]>([]);
@@ -221,7 +222,6 @@ export default function GTFSFeatureAnalytics(): React.ReactElement {
     enableStickyFooter: true,
     muiTableContainerProps: { sx: { maxHeight: '70vh' } },
     renderDetailPanel: ({ row }) => {
-      const theme = useTheme();
       const metrics = row.original;
 
       const chartData = metrics.computed_on.map((date, index) => ({
diff --git a/src/app/[locale]/metrics/_components/Analytics/GTFSNoticeAnalytics/GTFSNoticeAnalytics.tsx b/src/app/[locale]/metrics/_components/Analytics/GTFSNoticeAnalytics/GTFSNoticeAnalytics.tsx
index 5c003a8a..8019eeaf 100644
--- a/src/app/[locale]/metrics/_components/Analytics/GTFSNoticeAnalytics/GTFSNoticeAnalytics.tsx
+++ b/src/app/[locale]/metrics/_components/Analytics/GTFSNoticeAnalytics/GTFSNoticeAnalytics.tsx
@@ -39,6 +39,7 @@ import { useRemoteConfig } from '../../../../../context/RemoteConfigProvider';
 
 export default function GTFSNoticeAnalytics(): React.ReactElement {
   const router = useRouter();
+  const theme = useTheme();
   const searchParams = useSearchParams();
   const noticeCode = searchParams.get('noticeCode');
   const [data, setData] = useState<NoticeMetrics[]>([]);
@@ -193,7 +194,6 @@ export default function GTFSNoticeAnalytics(): React.ReactElement {
     enableStickyFooter: true,
     muiTableContainerProps: { sx: { maxHeight: '70vh' } },
     renderDetailPanel: ({ row }) => {
-      const theme = useTheme();
       const metrics = row.original;
 
       const chartData = metrics.computed_on.map((date, index) => ({
diff --git a/src/app/screens/Feed/components/AssociatedFeeds.tsx b/src/app/screens/Feed/components/AssociatedFeeds.tsx
index 116220e5..8f5bf71b 100644
--- a/src/app/screens/Feed/components/AssociatedFeeds.tsx
+++ b/src/app/screens/Feed/components/AssociatedFeeds.tsx
@@ -25,8 +25,8 @@ export interface AssociatedFeedsProps {
 
 const renderAssociatedGTFSFeedRow = (
   assocFeed: GTFSFeedType,
+  theme: ReturnType<typeof useTheme>,
 ): React.ReactElement | undefined => {
-  const theme = useTheme();
   if (assocFeed === undefined) {
     return undefined;
   }
@@ -69,8 +69,8 @@ const renderAssociatedGTFSFeedRow = (
 
 const renderAssociatedGTFSRTFeedRow = (
   assocGTFSRTFeed: GTFSRTFeedType,
+  theme: ReturnType<typeof useTheme>,
 ): React.ReactElement | undefined => {
-  const theme = useTheme();
   if (assocGTFSRTFeed === undefined) {
     return undefined;
   }
@@ -139,7 +139,7 @@ export default function AssociatedGTFSRTFeeds({
               sx={{ display: 'inline-table', width: '100%' }}
             >
               {gtfsFeeds?.map((assocFeed) =>
-                renderAssociatedGTFSFeedRow(assocFeed as GTFSFeedType),
+                renderAssociatedGTFSFeedRow(assocFeed as GTFSFeedType, theme),
               )}
             </TableBody>
           </TableContainer>
@@ -162,7 +162,7 @@ export default function AssociatedGTFSRTFeeds({
               sx={{ display: 'inline-table', width: '100%' }}
             >
               {gtfsRtFeeds?.map((assocGTFSRTFeed) =>
-                renderAssociatedGTFSRTFeedRow(assocGTFSRTFeed),
+                renderAssociatedGTFSRTFeedRow(assocGTFSRTFeed, theme),
               )}
             </TableBody>
           </TableContainer>
diff --git a/src/app/screens/Feeds/SearchTable.spec.tsx b/src/app/screens/Feeds/SearchTable.spec.tsx
index 1ae29840..601e7a6b 100644
--- a/src/app/screens/Feeds/SearchTable.spec.tsx
+++ b/src/app/screens/Feeds/SearchTable.spec.tsx
@@ -1,4 +1,4 @@
-import SearchTable, { getDataTypeElement } from './SearchTable';
+import SearchTable, { DataTypeElement } from './SearchTable';
 import { render, cleanup, screen, within } from '@testing-library/react';
 import { type AllFeedsType } from '../../services/feeds/utils';
 import { ThemeProvider } from '@mui/material/styles';
@@ -160,12 +160,12 @@ describe('getProviderElement', () => {
   });
 
   it('should display the correct data type depending on the feed type', () => {
-    const { getByText } = render(getDataTypeElement('gtfs'));
+    const { getByText } = render(<DataTypeElement dataType='gtfs' />);
     expect(getByText('gtfsSchedule')).toBeInTheDocument();
   });
 
   it('should display the correct data type depending on the feed type', () => {
-    const { getByText } = render(getDataTypeElement('gtfs_rt'));
+    const { getByText } = render(<DataTypeElement dataType='gtfs_rt' />);
     expect(getByText('gtfsRealtime')).toBeInTheDocument();
   });
 });
diff --git a/src/app/screens/Feeds/SearchTable.tsx b/src/app/screens/Feeds/SearchTable.tsx
index ad5ddad7..d9472294 100644
--- a/src/app/screens/Feeds/SearchTable.tsx
+++ b/src/app/screens/Feeds/SearchTable.tsx
@@ -37,27 +37,30 @@ const HeaderTableCell = styled(TableCell)(() => ({
   border: 'none',
 }));
 
-export const getDataTypeElement = (
-  dataType: 'gtfs' | 'gtfs_rt' | 'gbfs',
-): React.ReactElement => {
+const DataTypeHolder = ({
+  children,
+}: {
+  children: React.ReactNode;
+}): React.ReactElement => {
+  return (
+    <Box
+      sx={{
+        display: 'flex',
+        alignItems: 'center',
+        justifyContent: 'flex-start',
+      }}
+    >
+      {children}
+    </Box>
+  );
+};
+
+export const DataTypeElement = ({
+  dataType,
+}: {
+  dataType: 'gtfs' | 'gtfs_rt' | 'gbfs';
+}): React.ReactElement => {
   const tCommon = useTranslations('common');
-  const DataTypeHolder = ({
-    children,
-  }: {
-    children: React.ReactNode;
-  }): React.ReactElement => {
-    return (
-      <Box
-        sx={{
-          display: 'flex',
-          alignItems: 'center',
-          justifyContent: 'flex-start',
-        }}
-      >
-        {children}
-      </Box>
-    );
-  };
   if (dataType === 'gtfs') {
     return <DataTypeHolder>{tCommon('gtfsSchedule')}</DataTypeHolder>;
   } else if (dataType === 'gtfs_rt') {
@@ -268,7 +271,7 @@ export default function SearchTable({
               </TableCell>
               <TableCell className='feed-column' component={Box}>
                 <Box sx={{ display: 'flex', justifyContent: 'space-between' }}>
-                  {getDataTypeElement(feed.data_type)}
+                  <DataTypeElement dataType={feed.data_type} />
                   {feed.data_type === 'gtfs_rt' && (
                     <GtfsRtEntities
                       entities={feed.entity_types}

From 5390643d2e049015c6e40b3eea517b636b1d63cb Mon Sep 17 00:00:00 2001
From: Alessandro Kreslin <kalessandro14@gmail.com>
Date: Mon, 13 Jul 2026 11:32:21 -0400
Subject: [PATCH 3/5] eslint react-hooks/refs and
 react-hooks/set-state-in-render

---
 eslint.config.mjs                              |  2 --
 src/app/[locale]/account/AccountGeneral.tsx    | 16 ++++++++--------
 .../GBFSFeedAnalytics/GBFSFeedAnalytics.tsx    |  4 ++--
 src/app/components/GtfsVisualizationMap.tsx    |  1 -
 src/app/components/Map/ScanningOverlay.tsx     | 18 ++++++++----------
 src/app/utils/precompute.ts                    |  2 +-
 6 files changed, 19 insertions(+), 24 deletions(-)

diff --git a/eslint.config.mjs b/eslint.config.mjs
index af5b8b4c..afc9fd28 100644
--- a/eslint.config.mjs
+++ b/eslint.config.mjs
@@ -41,8 +41,6 @@ export default tseslint.config(
           ignoreRestSiblings: true,
         },
       ],
-      'react-hooks/refs': 'off',
-      'react-hooks/set-state-in-render': 'off',
       'react-hooks/set-state-in-effect': 'off',
       'react-hooks/immutability': 'off',
       'react-hooks/exhaustive-deps': 'off',
diff --git a/src/app/[locale]/account/AccountGeneral.tsx b/src/app/[locale]/account/AccountGeneral.tsx
index ea469f56..1d70c994 100644
--- a/src/app/[locale]/account/AccountGeneral.tsx
+++ b/src/app/[locale]/account/AccountGeneral.tsx
@@ -42,6 +42,9 @@ export default function AccountGeneral(): React.ReactElement {
     draftIsRegisteredToReceiveAPIAnnouncements,
     setDraftIsRegisteredToReceiveAPIAnnouncements,
   ] = React.useState(false);
+  const [alertSeverity, setAlertSeverity] = React.useState<'success' | 'error'>(
+    'success',
+  );
 
   const handleEditClick = (): void => {
     setDraftFullName(user?.fullName ?? '');
@@ -76,14 +79,13 @@ export default function AccountGeneral(): React.ReactElement {
   React.useEffect(() => {
     if (saveStatus === 'success') {
       setIsEditing(false);
+      setAlertSeverity('success');
+    } else if (saveStatus === 'fail') {
+      setAlertSeverity('error');
     }
   }, [saveStatus]);
 
-  // Reference is due to dispatch save status acting faster than the exit animation of the alert, causing a flash of the wrong alert severity. With this reference, the severity will be consistent during the whole display of the alert.
   const isSaving = saveStatus === 'loading';
-  const alertSeverity = React.useRef<'success' | 'error'>('success');
-  if (saveStatus === 'success') alertSeverity.current = 'success';
-  if (saveStatus === 'fail') alertSeverity.current = 'error';
 
   return (
     <>
@@ -96,15 +98,13 @@ export default function AccountGeneral(): React.ReactElement {
         anchorOrigin={{ vertical: 'top', horizontal: 'center' }}
       >
         <Alert
-          severity={alertSeverity.current}
+          severity={alertSeverity}
           onClose={() => {
             dispatch(saveUserProfileReset());
           }}
           sx={{ width: '100%' }}
         >
-          {alertSeverity.current === 'success'
-            ? t('saveSuccess')
-            : t('saveError')}
+          {alertSeverity === 'success' ? t('saveSuccess') : t('saveError')}
         </Alert>
       </Snackbar>
       <AccountSectionContainer
diff --git a/src/app/[locale]/metrics/_components/Analytics/GBFSFeedAnalytics/GBFSFeedAnalytics.tsx b/src/app/[locale]/metrics/_components/Analytics/GBFSFeedAnalytics/GBFSFeedAnalytics.tsx
index f25af323..dcc45dd4 100644
--- a/src/app/[locale]/metrics/_components/Analytics/GBFSFeedAnalytics/GBFSFeedAnalytics.tsx
+++ b/src/app/[locale]/metrics/_components/Analytics/GBFSFeedAnalytics/GBFSFeedAnalytics.tsx
@@ -1,6 +1,6 @@
 'use client';
 
-import React, { useMemo } from 'react';
+import React, { useMemo, useEffect } from 'react';
 import { useSelector, useDispatch } from 'react-redux';
 import FormHelperText from '@mui/material/FormHelperText';
 import { mkConfig, generateCsv, download } from 'export-to-csv';
@@ -126,7 +126,7 @@ export default function GBFSFeedAnalytics(): React.ReactElement {
     return filters;
   }, [versionFilter]);
 
-  useMemo(() => {
+  useEffect(() => {
     if (
       schemaPathInitFilter != null &&
       schemaPathFilterOptions.includes(schemaPathInitFilter)
diff --git a/src/app/components/GtfsVisualizationMap.tsx b/src/app/components/GtfsVisualizationMap.tsx
index d9f0ac45..a9edf09d 100644
--- a/src/app/components/GtfsVisualizationMap.tsx
+++ b/src/app/components/GtfsVisualizationMap.tsx
@@ -532,7 +532,6 @@ export const GtfsVisualizationMap = ({
               scannedTiles={scannedTiles}
               scanRowsCols={scanRowsCols}
               handleCancelScan={handleCancelScan}
-              cancelRequestRef={cancelRequestRef}
             />
           )}
 
diff --git a/src/app/components/Map/ScanningOverlay.tsx b/src/app/components/Map/ScanningOverlay.tsx
index 371d2ae6..09947b46 100644
--- a/src/app/components/Map/ScanningOverlay.tsx
+++ b/src/app/components/Map/ScanningOverlay.tsx
@@ -1,3 +1,4 @@
+import { useState } from 'react';
 import {
   Box,
   Button,
@@ -16,19 +17,13 @@ interface ScanningOverlayProps {
     cols: number;
   } | null;
   handleCancelScan: () => void;
-  cancelRequestRef: React.MutableRefObject<boolean>;
 }
 
 export const ScanningOverlay = (
   props: React.PropsWithChildren<ScanningOverlayProps>,
 ): React.ReactElement => {
-  const {
-    totalTiles,
-    scannedTiles,
-    scanRowsCols,
-    handleCancelScan,
-    cancelRequestRef,
-  } = props;
+  const { totalTiles, scannedTiles, scanRowsCols, handleCancelScan } = props;
+  const [cancelClicked, setCancelClicked] = useState(false);
   const theme = useTheme();
   const t = useTranslations('feeds');
   const progressPct =
@@ -121,8 +116,11 @@ export const ScanningOverlay = (
           <Button
             size='small'
             variant='outlined'
-            onClick={handleCancelScan}
-            disabled={cancelRequestRef.current}
+            onClick={() => {
+              setCancelClicked(true);
+              handleCancelScan();
+            }}
+            disabled={cancelClicked}
             aria-label={t('scanning.cancel')}
           >
             {t('scanning.cancel')}
diff --git a/src/app/utils/precompute.ts b/src/app/utils/precompute.ts
index 83490aad..55536cf1 100644
--- a/src/app/utils/precompute.ts
+++ b/src/app/utils/precompute.ts
@@ -300,7 +300,7 @@ export function createPrecomputation(deps: PrecomputeDeps): {
         .then(() => {})
         .catch((e) => {
           if (e.name === 'CancellationError') {
-            console.error('Precomputation cancelled by user.');
+            console.log('Precomputation cancelled by user.');
           }
         });
     });

From f5999eca51cbf34edb8c3f3e2a8436381e478182 Mon Sep 17 00:00:00 2001
From: Alessandro Kreslin <kalessandro14@gmail.com>
Date: Tue, 14 Jul 2026 09:00:59 -0400
Subject: [PATCH 4/5] enabled 'react-hooks/set-state-in-effect' eslint

---
 eslint.config.mjs                             |   1 -
 .../GBFSFeedAnalytics/GBFSFeedAnalytics.tsx   |  18 +--
 src/app/components/CoveredAreaMap.tsx         | 150 +++++++++---------
 src/app/components/RouteSelector.tsx          |  82 ++--------
 src/app/context/RemoteConfigProvider.tsx      |  17 +-
 .../components/NotificationSettingsDialog.tsx |   2 +
 src/app/screens/Feeds/SearchFilters.tsx       |  73 ++++-----
 .../GbfsValidator/GbfsFeedSearchInput.tsx     |  51 ++----
 .../GbfsValidator/ValidationReport.tsx        |  27 ++--
 .../screens/GbfsValidator/ValidationState.tsx |  21 +--
 10 files changed, 166 insertions(+), 276 deletions(-)

diff --git a/eslint.config.mjs b/eslint.config.mjs
index afc9fd28..88e13f44 100644
--- a/eslint.config.mjs
+++ b/eslint.config.mjs
@@ -41,7 +41,6 @@ export default tseslint.config(
           ignoreRestSiblings: true,
         },
       ],
-      'react-hooks/set-state-in-effect': 'off',
       'react-hooks/immutability': 'off',
       'react-hooks/exhaustive-deps': 'off',
       // TypeScript handles these; disable the core JS versions.
diff --git a/src/app/[locale]/metrics/_components/Analytics/GBFSFeedAnalytics/GBFSFeedAnalytics.tsx b/src/app/[locale]/metrics/_components/Analytics/GBFSFeedAnalytics/GBFSFeedAnalytics.tsx
index dcc45dd4..846cffbb 100644
--- a/src/app/[locale]/metrics/_components/Analytics/GBFSFeedAnalytics/GBFSFeedAnalytics.tsx
+++ b/src/app/[locale]/metrics/_components/Analytics/GBFSFeedAnalytics/GBFSFeedAnalytics.tsx
@@ -1,6 +1,6 @@
 'use client';
 
-import React, { useMemo, useEffect } from 'react';
+import React, { useMemo } from 'react';
 import { useSelector, useDispatch } from 'react-redux';
 import FormHelperText from '@mui/material/FormHelperText';
 import { mkConfig, generateCsv, download } from 'export-to-csv';
@@ -46,15 +46,16 @@ import { setAnalyticsBucketEndpoint } from '../../../../../utils/metricsUtils';
 export default function GBFSFeedAnalytics(): React.ReactElement {
   const searchParams = useSearchParams();
   const { config } = useRemoteConfig();
-  const [schemaPathFilters, setSchemaPathFilters] = React.useState<string[]>(
-    [],
-  );
 
   const versionFilter = searchParams.get('version');
   const schemaPathInitFilter = decodeURIComponent(
     searchParams.get('schemaPath') ?? '',
   );
 
+  const [schemaPathFilters, setSchemaPathFilters] = React.useState<string[]>(
+    schemaPathInitFilter ? [schemaPathInitFilter] : [],
+  );
+
   const dispatch = useDispatch();
   const rawData = useSelector(selectGBFSFeedMetrics);
   const status = useSelector(selectGBFSAnalyticsStatus);
@@ -126,15 +127,6 @@ export default function GBFSFeedAnalytics(): React.ReactElement {
     return filters;
   }, [versionFilter]);
 
-  useEffect(() => {
-    if (
-      schemaPathInitFilter != null &&
-      schemaPathFilterOptions.includes(schemaPathInitFilter)
-    ) {
-      setSchemaPathFilters([schemaPathInitFilter]);
-    }
-  }, [schemaPathInitFilter, schemaPathFilterOptions]);
-
   const columns = useTableColumns();
   const csvConfig = mkConfig({
     fieldSeparator: ',',
diff --git a/src/app/components/CoveredAreaMap.tsx b/src/app/components/CoveredAreaMap.tsx
index 82f57e4d..d2ba2292 100644
--- a/src/app/components/CoveredAreaMap.tsx
+++ b/src/app/components/CoveredAreaMap.tsx
@@ -1,6 +1,7 @@
 'use client';
 
-import React, { useState, useEffect, useMemo } from 'react';
+import React, { useState, useMemo } from 'react';
+import useSWR from 'swr';
 import {
   Box,
   ToggleButtonGroup,
@@ -95,15 +96,6 @@ const CoveredAreaMap: React.FC<CoveredAreaMapProps> = ({
   const theme = useTheme();
   const { config } = useRemoteConfig();
 
-  const [geoJsonData, setGeoJsonData] = useState<
-    GeoJSONData | GeoJSONDataGBFS | null
-  >(null);
-  const [geoJsonError, setGeoJsonError] = useState(false);
-  const [geoJsonLoading, setGeoJsonLoading] = useState(false);
-  const [view, setView] = useState<MapViews>(
-    feed?.data_type === 'gtfs' ? 'gtfsVisualizationView' : 'boundingBoxView',
-  );
-
   const latestGbfsVersion = useMemo((): GBFSVersionType | undefined => {
     if (feed?.data_type !== 'gbfs') return undefined;
     return getLatestGbfsVersion(feed as GBFSFeedType);
@@ -111,86 +103,89 @@ const CoveredAreaMap: React.FC<CoveredAreaMapProps> = ({
 
   const hasNoRoutes = totalRoutes == undefined || totalRoutes === 0;
 
-  const getAndSetGeoJsonData = (urlToExtract: string): void => {
-    setGeoJsonLoading(true);
-    fetchGeoJson(urlToExtract)
-      .then((data) => {
-        setGeoJsonData(data);
-        setGeoJsonError(false);
-      })
-      .catch(() => {
-        setGeoJsonError(true);
-      })
-      .finally(() => {
-        setGeoJsonLoading(false);
-      });
-  };
-
-  useEffect(() => {
+  // Compute the URL to fetch GeoJSON from, or null if nothing to fetch
+  const geoJsonUrl = useMemo(() => {
     if (feed?.data_type === 'gbfs') {
-      const latestGbfsVersionReportUrl =
+      const reportUrl =
         latestGbfsVersion?.latest_validation_report?.report_summary_url;
-      if (
-        !config.enableDetailedCoveredArea ||
-        latestGbfsVersionReportUrl === undefined
-      ) {
-        setGeoJsonData(null);
-        setGeoJsonError(config.enableDetailedCoveredArea);
-        return;
-      }
-      getAndSetGeoJsonData(latestGbfsVersionReportUrl);
-      return;
+      if (!config.enableDetailedCoveredArea || reportUrl == undefined)
+        return null;
+      return reportUrl;
     }
     if (
       feed?.data_type === 'gtfs' &&
-      latestDataset?.hosted_url != undefined &&
-      boundingBox != undefined &&
+      latestDataset?.hosted_url != null &&
+      boundingBox != null &&
       config.enableDetailedCoveredArea
     ) {
-      getAndSetGeoJsonData(latestDataset.hosted_url);
-      return;
+      return latestDataset.hosted_url;
     }
-    setGeoJsonData(null);
-    setGeoJsonError(config.enableDetailedCoveredArea);
-  }, [latestDataset, feed, config.enableDetailedCoveredArea]);
+    return null;
+  }, [
+    feed,
+    latestGbfsVersion,
+    latestDataset,
+    boundingBox,
+    config.enableDetailedCoveredArea,
+  ]);
+
+  const {
+    data: geoJsonData,
+    error: geoJsonError,
+    isLoading: geoJsonLoading,
+  } = useSWR(geoJsonUrl, fetchGeoJson, { revalidateOnFocus: false });
+
+  // For GBFS, the fetched data may still lack a computable bounding box
+  const gbfsGeoJsonBoundingBox =
+    feed?.data_type === 'gbfs' && geoJsonData != null
+      ? (computeBoundingBox(geoJsonData) ?? [])
+      : [];
+  const geoJsonFailed =
+    !!geoJsonError ||
+    (feed?.data_type === 'gbfs' &&
+      geoJsonData != null &&
+      gbfsGeoJsonBoundingBox.length === 0);
 
-  // effect to determine which view to display
-  useEffect(() => {
-    if (feed == undefined) return;
+  // Derive the default view from current props and loaded data
+  const computedView = useMemo((): MapViews => {
     if (feed?.data_type === 'gbfs') {
-      setView(
-        config.enableDetailedCoveredArea
-          ? 'detailedCoveredAreaView'
-          : 'boundingBoxView',
-      );
-      return;
+      return config.enableDetailedCoveredArea
+        ? 'detailedCoveredAreaView'
+        : 'boundingBoxView';
     }
-
-    // for gtfs feeds
-    if (
-      feed?.data_type === 'gtfs' &&
-      !hasNoRoutes &&
-      boundingBox != undefined
-    ) {
-      setView('gtfsVisualizationView');
-      return;
+    if (feed?.data_type === 'gtfs' && !hasNoRoutes && boundingBox != null) {
+      return 'gtfsVisualizationView';
     }
     if (
       config.enableDetailedCoveredArea &&
       geoJsonData != null &&
-      boundingBox != undefined
+      boundingBox != null
     ) {
-      setView('detailedCoveredAreaView');
-      return;
+      return 'detailedCoveredAreaView';
     }
-    setView('boundingBoxView');
-  }, [feed, totalRoutes, boundingBox, geoJsonData]);
+    return 'boundingBoxView';
+  }, [
+    feed?.data_type,
+    hasNoRoutes,
+    boundingBox,
+    geoJsonData,
+    config.enableDetailedCoveredArea,
+  ]);
+
+  // Track an explicit user view selection per feed so it resets on navigation
+  const [userViewState, setUserViewState] = useState<{
+    feedId: string;
+    view: MapViews;
+  } | null>(null);
+  const view =
+    userViewState?.feedId === feed?.id ? userViewState?.view : computedView;
 
   const handleViewChange = (
     _: React.MouseEvent<HTMLElement>,
     newView: MapViews | null,
   ): void => {
-    if (newView !== null) setView(newView);
+    if (newView !== null)
+      setUserViewState({ feedId: feed?.id ?? '', view: newView });
   };
 
   const handleOpenDetailedMapClick = (): void => {
@@ -255,17 +250,13 @@ const CoveredAreaMap: React.FC<CoveredAreaMapProps> = ({
       );
     }
     if (config.enableDetailedCoveredArea && geoJsonData != null) {
-      let gbfsGeoJsonBoundingBox: LngLatTuple[] = [];
-      if (feed?.data_type === 'gbfs') {
-        gbfsGeoJsonBoundingBox = computeBoundingBox(geoJsonData) ?? [];
-        if (gbfsGeoJsonBoundingBox.length === 0) {
-          setGeoJsonError(true);
-        }
-      }
       const feedBoundingBox: LngLatTuple[] =
         feed?.data_type === 'gtfs'
           ? (boundingBox ?? [])
           : gbfsGeoJsonBoundingBox;
+      if (feed?.data_type === 'gbfs' && gbfsGeoJsonBoundingBox.length === 0) {
+        return <></>;
+      }
       return (
         <MapGeoJSON
           key={`geojson-${feed?.id}`}
@@ -306,7 +297,7 @@ const CoveredAreaMap: React.FC<CoveredAreaMapProps> = ({
           variant='subtitle1'
           sx={{ color: 'text.secondary', mt: 0.5 }}
         >
-          {t('coveredAreaTitle') + ' - ' + t(view)}
+          {t('coveredAreaTitle') + ' - ' + t(view ?? '')}
         </Typography>
         {feed?.data_type === 'gbfs' && (
           <Box sx={{ textAlign: 'right' }}>
@@ -371,7 +362,8 @@ const CoveredAreaMap: React.FC<CoveredAreaMapProps> = ({
                     value='detailedCoveredAreaView'
                     disabled={
                       geoJsonLoading ||
-                      geoJsonError ||
+                      geoJsonFailed ||
+                      geoJsonUrl == null ||
                       boundingBox === undefined
                     }
                     aria-label='Detailed Covered Area View'
@@ -402,11 +394,11 @@ const CoveredAreaMap: React.FC<CoveredAreaMapProps> = ({
 
       {config.enableDetailedCoveredArea &&
         feed?.data_type === 'gbfs' &&
-        geoJsonError && (
+        (geoJsonFailed || geoJsonUrl == null) && (
           <WarningContentBox>{t('unableToGetGbfsMap')}</WarningContentBox>
         )}
 
-      {(boundingBox != undefined || !geoJsonError) && (
+      {(boundingBox != undefined || !geoJsonFailed) && (
         <Box key={view} sx={mapBoxPositionStyle}>
           {geoJsonLoading ? (
             <Skeleton
diff --git a/src/app/components/RouteSelector.tsx b/src/app/components/RouteSelector.tsx
index 1db5ef2d..8d29eebf 100644
--- a/src/app/components/RouteSelector.tsx
+++ b/src/app/components/RouteSelector.tsx
@@ -1,7 +1,6 @@
 import React, {
   useState,
   useMemo,
-  useEffect,
   useCallback,
   useLayoutEffect,
   useRef,
@@ -14,10 +13,8 @@ import {
   Typography,
   Box,
   ListItemButton,
-  Skeleton,
 } from '@mui/material';
 import { type GtfsRoute } from '../types';
-import { debounce } from 'lodash';
 import { List, type RowComponentProps } from 'react-window';
 
 interface RouteSelectorProps {
@@ -96,10 +93,6 @@ export default function RouteSelector({
   onSelectionChange,
 }: RouteSelectorProps): React.ReactElement {
   const [search, setSearch] = useState('');
-  const [inputValue, setInputValue] = useState('');
-  const [selectedRoutes, setSelectedRoutes] =
-    useState<string[]>(selectedRouteIds);
-  const [isSearching, setIsSearching] = useState(false);
   const [listWidth, setListWidth] = useState<number>(0);
 
   const containerRef = useRef<HTMLDivElement | null>(null);
@@ -123,29 +116,6 @@ export default function RouteSelector({
     };
   }, [listWidth]);
 
-  // Debounced search input -> committed search term
-  const debouncedSetSearch = useMemo(
-    () =>
-      debounce((val: string) => {
-        setSearch(val);
-        setIsSearching(false);
-      }, 500),
-    [],
-  );
-
-  useEffect(() => {
-    setIsSearching(true);
-    debouncedSetSearch(inputValue);
-    return () => {
-      debouncedSetSearch.cancel();
-    };
-  }, [inputValue, debouncedSetSearch]);
-
-  // Keep internal selection in sync with controlled prop
-  useEffect(() => {
-    setSelectedRoutes([...selectedRouteIds]);
-  }, [selectedRouteIds]);
-
   // Prepare routes for faster filtering (sorted + lowercase caches)
   const preparedRoutes = useMemo<PreparedRoute[]>(() => {
     const copy = [...routes];
@@ -170,16 +140,12 @@ export default function RouteSelector({
   const handleToggle = useCallback(
     (routeId: string | undefined): void => {
       if (routeId == undefined) return;
-      setSelectedRoutes((prev) => {
-        const newSelection = prev.includes(routeId)
-          ? prev.filter((id) => id !== routeId)
-          : [...prev, routeId];
-
-        onSelectionChange?.(newSelection);
-        return newSelection;
-      });
+      const newSelection = selectedRouteIds.includes(routeId)
+        ? selectedRouteIds.filter((id) => id !== routeId)
+        : [...selectedRouteIds, routeId];
+      onSelectionChange?.(newSelection);
     },
-    [onSelectionChange],
+    [selectedRouteIds, onSelectionChange],
   );
 
   // Compute row height before render using an offscreen measurer
@@ -257,9 +223,9 @@ export default function RouteSelector({
         size='small'
         variant='outlined'
         placeholder='Search routes...'
-        value={inputValue}
+        value={search}
         onChange={(e) => {
-          setInputValue(e.target.value);
+          setSearch(e.target.value);
         }}
         sx={{ mb: 1 }}
       />
@@ -282,30 +248,16 @@ export default function RouteSelector({
           }}
         />
 
-        {/* Skeleton while debounce is active */}
-        {isSearching ? (
-          <Box sx={{ px: 0.5 }}>
-            {[...Array(6)].map((_, i) => (
-              <Skeleton
-                key={i}
-                variant='rectangular'
-                height={40}
-                sx={{ mb: 1, borderRadius: 1 }}
-              />
-            ))}
-          </Box>
-        ) : (
-          <List
-            rowCount={filteredRoutes.length}
-            rowProps={{
-              routes: filteredRoutes,
-              selectedRoutes,
-              onToggle: handleToggle,
-            }}
-            rowComponent={RowComponent}
-            rowHeight={rowHeight}
-          />
-        )}
+        <List
+          rowCount={filteredRoutes.length}
+          rowProps={{
+            routes: filteredRoutes,
+            selectedRoutes: selectedRouteIds,
+            onToggle: handleToggle,
+          }}
+          rowComponent={RowComponent}
+          rowHeight={rowHeight}
+        />
       </Box>
     </Box>
   );
diff --git a/src/app/context/RemoteConfigProvider.tsx b/src/app/context/RemoteConfigProvider.tsx
index 12afcb0a..d83d8285 100644
--- a/src/app/context/RemoteConfigProvider.tsx
+++ b/src/app/context/RemoteConfigProvider.tsx
@@ -2,8 +2,7 @@
 
 import React, {
   createContext,
-  useState,
-  useEffect,
+  useMemo,
   type ReactNode,
   useContext,
 } from 'react';
@@ -47,15 +46,11 @@ export const RemoteConfigProvider = ({
   config,
 }: RemoteConfigProviderProps): React.ReactElement => {
   const { email, isAuthReady } = useAuthSession();
-  const [effectiveConfig, setEffectiveConfig] = useState(config);
-
-  useEffect(() => {
-    if (!isAuthReady) return;
-    setEffectiveConfig(
-      matchesFeatureFlagBypass(email, config.featureFlagBypass)
-        ? applyAdminBypass(config)
-        : config,
-    );
+  const effectiveConfig = useMemo(() => {
+    if (!isAuthReady) return config;
+    return matchesFeatureFlagBypass(email, config.featureFlagBypass)
+      ? applyAdminBypass(config)
+      : config;
   }, [email, isAuthReady, config]);
 
   return (
diff --git a/src/app/screens/Feed/components/NotificationSettingsDialog.tsx b/src/app/screens/Feed/components/NotificationSettingsDialog.tsx
index 75b7d8f6..6aec33fd 100644
--- a/src/app/screens/Feed/components/NotificationSettingsDialog.tsx
+++ b/src/app/screens/Feed/components/NotificationSettingsDialog.tsx
@@ -1,4 +1,6 @@
 'use client';
+/* eslint-disable */
+// eslint disabled due to it still being in development 
 
 // This component is subject to change based on the actual notification settings we want to offer and the APIs available to save them. For now it's a mockup of what the UI could look like.
 
diff --git a/src/app/screens/Feeds/SearchFilters.tsx b/src/app/screens/Feeds/SearchFilters.tsx
index 6bfda51e..789727cc 100644
--- a/src/app/screens/Feeds/SearchFilters.tsx
+++ b/src/app/screens/Feeds/SearchFilters.tsx
@@ -7,7 +7,7 @@ import NestedCheckboxList, {
 import { useTranslations } from 'next-intl';
 import { useRemoteConfig } from '../../context/RemoteConfigProvider';
 import ExpandMoreIcon from '@mui/icons-material/ExpandMore';
-import { useEffect, useState } from 'react';
+import { useState, useMemo } from 'react';
 import { DATASET_FEATURES, groupFeaturesByComponent } from '../../utils/consts';
 import { type GbfsVersionConfig } from '../../interface/RemoteConfig';
 import { SearchHeader } from '../../styles/Filters.styles';
@@ -22,6 +22,38 @@ function setInitialExpandGroup(): Record<string, boolean> {
   return expandGroup;
 }
 
+function generateCheckboxStructure(
+  selectedFeatures: string[],
+  expandedElements: Record<string, boolean>,
+): CheckboxStructure[] {
+  const groupedFeatures = groupFeaturesByComponent(
+    Object.keys(DATASET_FEATURES),
+    true,
+  );
+  return Object.entries(groupedFeatures)
+    .filter(([parent]) => parent !== 'Other')
+    .sort(([keyA], [keyB]) => keyA.localeCompare(keyB))
+    .map(([parent, features]) => ({
+      title: parent,
+      checked: features.every((feature) =>
+        selectedFeatures.includes(feature.feature),
+      ),
+      seeChildren: expandedElements[parent],
+      type: 'checkbox',
+      children: features
+        .sort((a, b) => a.feature.localeCompare(b.feature))
+        .map((feature) => {
+          return {
+            title: feature.feature,
+            type: 'checkbox',
+            checked: selectedFeatures.some(
+              (selectedFeature) => selectedFeature === feature.feature,
+            ),
+          };
+        }),
+    }));
+}
+
 interface SearchFiltersProps {
   selectedFeedTypes: Record<string, boolean>;
   isOfficialFeedSearch: boolean;
@@ -81,9 +113,6 @@ export function SearchFilters({
     licenses: true,
     licenseTags: true,
   });
-  const [featureCheckboxData, setFeatureCheckboxData] = useState<
-    CheckboxStructure[]
-  >([]);
   const [expandedElements, setExpandedElements] = useState<
     Record<string, boolean>
   >(setInitialExpandGroup());
@@ -106,38 +135,10 @@ export function SearchFilters({
     },
   ];
 
-  function generateCheckboxStructure(): CheckboxStructure[] {
-    const groupedFeatures = groupFeaturesByComponent(
-      Object.keys(DATASET_FEATURES),
-      true,
-    );
-    return Object.entries(groupedFeatures)
-      .filter(([parent]) => parent !== 'Other')
-      .sort(([keyA], [keyB]) => keyA.localeCompare(keyB))
-      .map(([parent, features]) => ({
-        title: parent,
-        checked: features.every((feature) =>
-          selectedFeatures.includes(feature.feature),
-        ),
-        seeChildren: expandedElements[parent],
-        type: 'checkbox',
-        children: features
-          .sort((a, b) => a.feature.localeCompare(b.feature))
-          .map((feature) => {
-            return {
-              title: feature.feature,
-              type: 'checkbox',
-              checked: selectedFeatures.some(
-                (selectedFeature) => selectedFeature === feature.feature,
-              ),
-            };
-          }),
-      }));
-  }
-
-  useEffect(() => {
-    setFeatureCheckboxData(generateCheckboxStructure());
-  }, [selectedFeatures]);
+  const featureCheckboxData = useMemo(
+    () => generateCheckboxStructure(selectedFeatures, expandedElements),
+    [selectedFeatures, expandedElements],
+  );
 
   return (
     <>
diff --git a/src/app/screens/GbfsValidator/GbfsFeedSearchInput.tsx b/src/app/screens/GbfsValidator/GbfsFeedSearchInput.tsx
index cb821691..fea9d644 100644
--- a/src/app/screens/GbfsValidator/GbfsFeedSearchInput.tsx
+++ b/src/app/screens/GbfsValidator/GbfsFeedSearchInput.tsx
@@ -14,7 +14,7 @@ import {
   type SelectChangeEvent,
 } from '@mui/material';
 import SearchIcon from '@mui/icons-material/Search';
-import { useEffect, useState } from 'react';
+import { useState } from 'react';
 import { useRouter } from 'next/navigation';
 import { AuthTypeEnum, useGbfsAuth } from '../../context/GbfsAuthProvider';
 import { useSelector } from 'react-redux';
@@ -36,58 +36,29 @@ export default function GbfsFeedSearchInput({
   const [autoDiscoveryUrlInput, setAutoDiscoveryUrlInput] = useState<string>(
     initialFeedUrl ?? '',
   );
-  const [requiresAuth, setRequiresAuth] = useState(false);
-  const [authType, setAuthType] = useState<AuthTypeEnum | ''>('');
+  const [requiresAuth, setRequiresAuth] = useState(auth !== undefined);
+  const [authType, setAuthType] = useState<AuthTypeEnum | ''>(
+    auth == undefined ? '' : ((auth.authType as AuthTypeEnum) ?? ''),
+  );
   const [basicAuthUsername, setBasicAuthUsername] = useState<
     string | undefined
-  >(undefined);
+  >(auth != null && 'username' in auth ? auth.username : undefined);
   const [basicAuthPassword, setBasicAuthPassword] = useState<
     string | undefined
-  >(undefined);
+  >(auth != null && 'password' in auth ? auth.password : undefined);
   const [bearerAuthValue, setBearerAuthValue] = useState<string | undefined>(
-    undefined,
+    auth != null && 'token' in auth ? auth.token : undefined,
   );
   const [oauthClientId, setOauthClientId] = useState<string | undefined>(
-    undefined,
+    auth != null && 'clientId' in auth ? auth.clientId : undefined,
   );
   const [oauthClientSecret, setOauthClientSecret] = useState<
     string | undefined
-  >(undefined);
+  >(auth != null && 'clientSecret' in auth ? auth.clientSecret : undefined);
   const [oauthTokenUrl, setOauthTokenUrl] = useState<string | undefined>(
-    undefined,
+    auth != null && 'tokenUrl' in auth ? auth.tokenUrl : undefined,
   );
 
-  // Used to keep the text input up to date with back navigation in browser
-  useEffect(() => {
-    setAutoDiscoveryUrlInput(initialFeedUrl ?? '');
-  }, [initialFeedUrl]);
-
-  // Used to keep the auth inputs up to date
-  useEffect(() => {
-    setRequiresAuth(auth !== undefined);
-    setAuthType(
-      auth == undefined ? '' : ((auth.authType as AuthTypeEnum) ?? ''),
-    );
-    setBasicAuthUsername(
-      auth != null && 'username' in auth ? auth.username : undefined,
-    );
-    setBasicAuthPassword(
-      auth != null && 'password' in auth ? auth.password : undefined,
-    );
-    setBearerAuthValue(
-      auth != null && 'token' in auth ? auth.token : undefined,
-    );
-    setOauthClientId(
-      auth != null && 'clientId' in auth ? auth.clientId : undefined,
-    );
-    setOauthClientSecret(
-      auth != null && 'clientSecret' in auth ? auth.clientSecret : undefined,
-    );
-    setOauthTokenUrl(
-      auth != null && 'tokenUrl' in auth ? auth.tokenUrl : undefined,
-    );
-  }, [auth]);
-
   const handleChange = (event: React.ChangeEvent<HTMLInputElement>): void => {
     setRequiresAuth(event.target.checked);
   };
diff --git a/src/app/screens/GbfsValidator/ValidationReport.tsx b/src/app/screens/GbfsValidator/ValidationReport.tsx
index 087f4150..625c1bf2 100644
--- a/src/app/screens/GbfsValidator/ValidationReport.tsx
+++ b/src/app/screens/GbfsValidator/ValidationReport.tsx
@@ -25,7 +25,7 @@ import WarningAmberOutlinedIcon from '@mui/icons-material/WarningAmberOutlined';
 import CheckCircleOutlineIcon from '@mui/icons-material/CheckCircleOutline';
 import LanguageIcon from '@mui/icons-material/Language';
 import { type components } from '../../services/feeds/gbfs-validator-types';
-import { useEffect, useMemo, useRef, useState } from 'react';
+import { useRef, useState } from 'react';
 import { OpenInNew } from '@mui/icons-material';
 import {
   ValidationReportTableStyles,
@@ -45,6 +45,9 @@ export type ValidationResult = components['schemas']['ValidationResult'];
 export type GbfsFile = components['schemas']['GbfsFile'];
 export type FileError = components['schemas']['FileError'];
 
+// needed as a module level constant to avoid re-rendering the component when the array is empty
+const EMPTY_FILES: GbfsFile[] = [];
+
 interface ValidationResultProps {
   validationResult: ValidationResult | undefined;
   loading: boolean;
@@ -61,11 +64,9 @@ export default function ValidationReport({
   const [groupedExpanded, setGroupedExpanded] = useState<
     Record<string, boolean>
   >({});
-  const allFiles: GbfsFile[] = validationResult?.summary?.files ?? [];
-  const baseFiles: GbfsFile[] = allFiles.filter((f) => f.language == null);
-  const languageSpecificFiles: GbfsFile[] = allFiles.filter(
-    (f) => f.language != null,
-  );
+  const allFiles = validationResult?.summary?.files ?? EMPTY_FILES;
+  const baseFiles = allFiles.filter((f) => f.language == null);
+  const languageSpecificFiles = allFiles.filter((f) => f.language != null);
   const languages = Array.from(
     new Set(languageSpecificFiles.map((f) => f.language ?? '')),
   ).sort();
@@ -73,14 +74,7 @@ export default function ValidationReport({
     languages[0] ?? '',
   );
 
-  // Adjust selectedLanguage if languages set changes (e.g., after loading finishes)
-  useEffect(() => {
-    if (languages.length > 0 && !languages.includes(selectedLanguage)) {
-      setSelectedLanguage(languages[0]);
-    }
-  }, [languages, selectedLanguage]);
-
-  const filesForLanguage: GbfsFile[] =
+  const filesForLanguage =
     selectedLanguage !== ''
       ? [
           ...baseFiles,
@@ -90,10 +84,7 @@ export default function ValidationReport({
         ]
       : [...baseFiles];
   // Group errors by fileName, normalized instancePath and message. Shared util ensures consistency.
-  const groupedByFile = useMemo(
-    () => groupErrorsByFile(filesForLanguage),
-    [filesForLanguage],
-  );
+  const groupedByFile = groupErrorsByFile(filesForLanguage);
   const fileGroupRefs = useRef<Array<HTMLDivElement | null>>([]);
 
   // Error details dialog selection state
diff --git a/src/app/screens/GbfsValidator/ValidationState.tsx b/src/app/screens/GbfsValidator/ValidationState.tsx
index 15129c4f..3abdaeeb 100644
--- a/src/app/screens/GbfsValidator/ValidationState.tsx
+++ b/src/app/screens/GbfsValidator/ValidationState.tsx
@@ -85,20 +85,13 @@ export default function ValidationState(): ReactElement {
   };
 
   useEffect(() => {
-    let timer: ReturnType<typeof setTimeout> | null = null;
-    if (loadingState) {
-      timer = setTimeout(() => {
-        setLongLoadingState(true);
-      }, 5000);
-    } else {
-      setLongLoadingState(false);
-    }
-
+    if (!loadingState) return;
+    const timer = setTimeout(() => {
+      setLongLoadingState(true);
+    }, 5000);
     return () => {
-      // cleanup timer on unmount or when loadingState changes
-      if (timer != null) {
-        clearTimeout(timer);
-      }
+      clearTimeout(timer);
+      setLongLoadingState(false);
     };
   }, [loadingState]);
 
@@ -117,6 +110,7 @@ export default function ValidationState(): ReactElement {
       >
         <Container maxWidth='lg' sx={{ my: 2 }}>
           <GbfsFeedSearchInput
+            key={feedUrl ?? ''}
             initialFeedUrl={feedUrl ?? ''}
             triggerDataFetch={triggerDataFetch}
           ></GbfsFeedSearchInput>
@@ -250,6 +244,7 @@ export default function ValidationState(): ReactElement {
         </Box> */}
 
         <ValidationReport
+          key={feedUrl ?? ''}
           validationResult={validationResult}
           loading={loadingState}
         ></ValidationReport>

From e21ba49d288a94876487032a8de39e6a646ed7cb Mon Sep 17 00:00:00 2001
From: Alessandro Kreslin <kalessandro14@gmail.com>
Date: Tue, 14 Jul 2026 09:25:03 -0400
Subject: [PATCH 5/5] theme type fix

---
 src/app/screens/Feed/components/AssociatedFeeds.tsx | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/src/app/screens/Feed/components/AssociatedFeeds.tsx b/src/app/screens/Feed/components/AssociatedFeeds.tsx
index 8f5bf71b..a83a4580 100644
--- a/src/app/screens/Feed/components/AssociatedFeeds.tsx
+++ b/src/app/screens/Feed/components/AssociatedFeeds.tsx
@@ -11,6 +11,7 @@ import {
   Typography,
   useTheme,
 } from '@mui/material';
+import { type Theme } from '@mui/material/styles';
 import {
   type GTFSFeedType,
   type AllFeedType,
@@ -25,7 +26,7 @@ export interface AssociatedFeedsProps {
 
 const renderAssociatedGTFSFeedRow = (
   assocFeed: GTFSFeedType,
-  theme: ReturnType<typeof useTheme>,
+  theme: Theme,
 ): React.ReactElement | undefined => {
   if (assocFeed === undefined) {
     return undefined;
@@ -69,7 +70,7 @@ const renderAssociatedGTFSFeedRow = (
 
 const renderAssociatedGTFSRTFeedRow = (
   assocGTFSRTFeed: GTFSRTFeedType,
-  theme: ReturnType<typeof useTheme>,
+  theme: Theme,
 ): React.ReactElement | undefined => {
   if (assocGTFSRTFeed === undefined) {
     return undefined;