Use env flag for maintenance, remove SSR helpers

Switch maintenance handling from server-side helpers to a runtime env flag. Adds redirects in next.config.mjs to send key routes to /maintenance when IS_IN_MAINTENANCE_MODE is set, removes src/lib/server/maintenance.ts and its getServerSideProps usages across pages, and replaces SSR checks with client-side NEXT_PUBLIC_IS_IN_MAINTENANCE_MODE checks in overlay, widget, login, index and verify pages. Also deletes the now-playing Last.fm API route (src/pages/api/lastfm/now-playing.ts). Minor cleanup: simplify overlay scaling logic and effect dependencies, remove unused imports.

Author: Geczy

next.config.mjs

@@ -18,7 +18,7 @@ const nextConfig = {
     NEXT_PUBLIC_LASTFM_API_KEY: process.env.LASTFM_API_KEY,
   },
   async redirects() {
-    return [
+    const redirects = [
       {
         source: '/install',
         destination: '/api/install',
@@ -30,6 +30,16 @@ const nextConfig = {
         permanent: false,
       },
     ]
+
+    if (process.env.IS_IN_MAINTENANCE_MODE === 'true') {
+      redirects.push(
+        { source: '/', destination: '/maintenance', permanent: false },
+        { source: '/login', destination: '/maintenance', permanent: false },
+        { source: '/verify', destination: '/maintenance', permanent: false },
+      )
+    }
+
+    return redirects
   },
   async rewrites() {
     return [

src/lib/server/maintenance.ts

@@ -1,12 +1,10 @@
-import type { GetServerSideProps } from 'next'
 import type { ReactElement } from 'react'
 import { Faqs } from '@/components/Homepage/Faqs'
 import { Hero } from '@/components/Homepage/Hero'
 import HomepageShell from '@/components/Homepage/HomepageShell'
 import { PrimaryFeatures } from '@/components/Homepage/PrimaryFeatures'
 import { SecondaryFeatures } from '@/components/Homepage/SecondaryFeatures'
 import { Pricing } from '@/components/Pricing'
-import { getMaintenanceRedirect } from '@/lib/server/maintenance'
 import type { NextPageWithLayout } from '@/pages/_app'
 
 const Index: NextPageWithLayout = () => (
@@ -40,5 +38,3 @@ Index.getLayout = function getLayout(page: ReactElement) {
 }
 
 export default Index
-
-export const getServerSideProps: GetServerSideProps = async (ctx) => getMaintenanceRedirect(ctx)

src/pages/api/lastfm/now-playing.ts

@@ -1,14 +1,12 @@
 import * as Sentry from '@sentry/nextjs'
 import { App, Typography } from 'antd'
-import type { GetServerSideProps } from 'next'
 import Link from 'next/link'
 import { useRouter } from 'next/router'
 import { useSession } from 'next-auth/react'
 import { type ReactElement, useCallback, useEffect } from 'react'
 import { Container } from '@/components/Container'
 import { UserAuthForm } from '@/components/Homepage/AuthForm'
 import HomepageShell from '@/components/Homepage/HomepageShell'
-import { getMaintenanceRedirect } from '@/lib/server/maintenance'
 import type { NextPageWithLayout } from '@/pages/_app'
 
 const Login: NextPageWithLayout = () => {
@@ -124,5 +122,3 @@ Login.getLayout = function getLayout(page: ReactElement) {
 }
 
 export default Login
-
-export const getServerSideProps: GetServerSideProps = async (ctx) => getMaintenanceRedirect(ctx)

src/pages/index.tsx

@@ -1,20 +1,11 @@
-import type { GetServerSideProps } from 'next'
 import MainOverlay from '@/components/Overlay'
-import { getOverlayMaintenanceProps } from '@/lib/server/maintenance'
 
-interface OverlayUserPageProps {
-  maintenanceBlank: boolean
-}
-
-const OverlayUserPage = ({ maintenanceBlank }: OverlayUserPageProps) => {
-  if (maintenanceBlank) {
+const OverlayUserPage = () => {
+  if (process.env.NEXT_PUBLIC_IS_IN_MAINTENANCE_MODE === 'true') {
     return null
   }
 
   return <MainOverlay />
 }
 
 export default OverlayUserPage
-
-export const getServerSideProps: GetServerSideProps<OverlayUserPageProps> = async () =>
-  getOverlayMaintenanceProps({})

src/pages/login.tsx

@@ -1,5 +1,4 @@
 import { clsx } from 'clsx'
-import type { GetServerSideProps } from 'next'
 import { useRouter } from 'next/router'
 import { useEffect, useState } from 'react'
 import type { Socket } from 'socket.io-client'
@@ -14,14 +13,12 @@ import type { wlType } from '@/lib/hooks/useSocket'
 import { useTransformRes } from '@/lib/hooks/useTransformRes'
 import { useUpdateSetting } from '@/lib/hooks/useUpdateSetting'
 import { getRankDetail, getRankImage, type RankType } from '@/lib/ranks'
-import { getOverlayMaintenanceProps } from '@/lib/server/maintenance'
+
+const isMaintenanceMode = process.env.NEXT_PUBLIC_IS_IN_MAINTENANCE_MODE === 'true'
 
 let socket: Socket | null = null
-interface WidgetPageProps {
-  maintenanceBlank: boolean
-}
 
-function WidgetPage({ maintenanceBlank }: WidgetPageProps) {
+function WidgetPage() {
   const { mutate } = useUpdateSetting(Settings.commandWL)
   const router = useRouter()
   const { userId } = router.query
@@ -49,7 +46,7 @@ function WidgetPage({ maintenanceBlank }: WidgetPageProps) {
   })
 
   useEffect(() => {
-    if (maintenanceBlank) return
+    if (isMaintenanceMode) return
     if (!userId) return
 
     console.log('Connecting to socket init...')
@@ -77,20 +74,20 @@ function WidgetPage({ maintenanceBlank }: WidgetPageProps) {
         notLoaded: false,
       })
     })
-  }, [maintenanceBlank, userId])
+  }, [userId])
 
   useEffect(() => {
-    if (maintenanceBlank) return
+    if (isMaintenanceMode) return
 
     return () => {
       socket?.off('update-wl')
       socket?.off('refresh-settings')
       socket?.off('update-medal')
     }
-  }, [maintenanceBlank])
+  }, [])
 
   useEffect(() => {
-    if (maintenanceBlank) return
+    if (isMaintenanceMode) return
     if (!original) return
 
     const steamAccount = original.SteamAccount?.[0]
@@ -106,9 +103,9 @@ function WidgetPage({ maintenanceBlank }: WidgetPageProps) {
     }
 
     setRankImageDetails(rankDetails)
-  }, [maintenanceBlank, original])
+  }, [original])
 
-  if (maintenanceBlank) {
+  if (isMaintenanceMode) {
     return null
   }
 
@@ -147,6 +144,3 @@ function WidgetPage({ maintenanceBlank }: WidgetPageProps) {
 }
 
 export default WidgetPage
-
-export const getServerSideProps: GetServerSideProps<WidgetPageProps> = async () =>
-  getOverlayMaintenanceProps({})

src/pages/overlay/[userId]/index.tsx

@@ -1,53 +1,43 @@
 import { Spin } from 'antd'
-import type { GetServerSideProps } from 'next'
 import Head from 'next/head'
 import { useSession } from 'next-auth/react'
 import type { ReactElement } from 'react'
 import { useEffect, useState } from 'react'
 import DashboardShell from '@/components/Dashboard/DashboardShell'
 import Header from '@/components/Dashboard/Header'
-import { getOverlayMaintenanceProps } from '@/lib/server/maintenance'
 
-interface OverlayPageProps {
-  maintenanceBlank: boolean
-}
+const isMaintenanceMode = process.env.NEXT_PUBLIC_IS_IN_MAINTENANCE_MODE === 'true'
 
-const OverlayPage = ({ maintenanceBlank }: OverlayPageProps) => {
+const OverlayPage = () => {
   const { data } = useSession()
-  const [scale, setScale] = useState(1) // Initial scale is 1
-  const [isLoading, setIsLoading] = useState(true) // Initial state is loading
+  const [scale, setScale] = useState(1)
+  const [isLoading, setIsLoading] = useState(true)
 
   useEffect(() => {
-    if (maintenanceBlank) return
+    if (isMaintenanceMode) return
 
     const resizeListener = () => {
-      // Assuming headerHeight and sideNavWidth are known or can be dynamically calculated
-      const headerHeight = 309 // Example height of the header
-      const sideNavWidth = 380 // Example width of the side navigation
+      const headerHeight = 309
+      const sideNavWidth = 380
 
-      // Adjust window dimensions by subtracting the sizes of header and side navigation
       const adjustedWidth = window.innerWidth - sideNavWidth
       const adjustedHeight = window.innerHeight - headerHeight
 
-      // Calculate the scale ratio based on adjusted window size and content size (1920x1080)
       const scaleX = adjustedWidth / 1920
       const scaleY = adjustedHeight / 1080
-      const newScale = Math.min(scaleX, scaleY) // Use the smaller scale to ensure content fits in both dimensions
+      const newScale = Math.min(scaleX, scaleY)
 
       setScale(newScale)
     }
 
-    // Set initial scale
     resizeListener()
 
-    // Add event listener
     window.addEventListener('resize', resizeListener)
 
-    // Cleanup function to remove event listener
     return () => window.removeEventListener('resize', resizeListener)
-  }, [maintenanceBlank])
+  }, [])
 
-  if (maintenanceBlank) {
+  if (isMaintenanceMode) {
     return null
   }
 
@@ -96,6 +86,3 @@ OverlayPage.getLayout = function getLayout(page: ReactElement) {
 }
 
 export default OverlayPage
-
-export const getServerSideProps: GetServerSideProps<OverlayPageProps> = async () =>
-  getOverlayMaintenanceProps({})