Add shutdown notice

Author: codetheweb

package.json

@@ -131,11 +131,11 @@
       "^src/(.*)$": "<rootDir>/src/$1"
     },
     "globals": {
-        "ts-jest": {
-            "tsconfig": {
-                "jsx": "react"
-            }
+      "ts-jest": {
+        "tsconfig": {
+          "jsx": "react"
         }
+      }
     }
   },
   "dependencies": {

src/components/link.tsx

@@ -9,13 +9,22 @@ type IWrappedLinkProps = {
 	isExternal?: boolean;
 };
 
+const onClick = (href: string) => {
+	if (window.umami) {
+		// eslint-disable-next-line @typescript-eslint/no-unsafe-call
+		window.umami.track('click', {href});
+	}
+};
+
 const WrappedLink = observer((props: LinkProps & IWrappedLinkProps) => {
 	const {href, isExternal, ...otherProps} = props;
 
 	if (href.includes(':') || isExternal) {
 		// External link
 		return (
-			<ChakraLink {...props} isExternal>
+			<ChakraLink {...props} isExternal onClick={() => {
+				onClick(href);
+			}}>
 				<Wrap align='center'>
 					<WrapItem>
 						{props.children}

src/components/shutdown-warning.tsx

@@ -0,0 +1,41 @@
+import {Button, AlertDialog, useDisclosure, AlertDialogOverlay, AlertDialogBody, AlertDialogContent, AlertDialogFooter, AlertDialogHeader} from '@chakra-ui/react';
+import {observer} from 'mobx-react-lite';
+import WrappedLink from './link';
+
+export const ShutdownWarning = observer(() => {
+	const {isOpen, onClose} = useDisclosure({defaultIsOpen: true});
+
+	return (
+		<AlertDialog
+			isOpen={isOpen}
+			onClose={onClose}
+			leastDestructiveRef={undefined}
+		>
+			<AlertDialogOverlay>
+				<AlertDialogContent>
+					<AlertDialogHeader fontSize='lg' fontWeight='bold'>
+          Shutdown notice
+					</AlertDialogHeader>
+
+					<AlertDialogBody>
+						<p style={{marginBottom: '1rem'}}>
+            I will be shutting down this website at the end of April 2025. Data from previous semester will still be available, but no new data will be added.
+						</p>
+						<p style={{marginBottom: '1rem'}}>
+            I emailed the Dean of the College of Computing a few months ago to see if they would be interested in taking over this website. He was aware that many students use this but seemed uninterested in running it.
+						</p>
+						<p>
+            If you want Michigan Tech Courses to stay active, please email <WrappedLink href='mailto:[email protected]' display='inline-block'>[email protected]</WrappedLink> and ask that they reconsider. You can also reach me at <WrappedLink href='mailto:[email protected]' display='inline-block'>[email protected]</WrappedLink>.
+						</p>
+					</AlertDialogBody>
+
+					<AlertDialogFooter>
+						<Button onClick={onClose}>
+            ok :(
+						</Button>
+					</AlertDialogFooter>
+				</AlertDialogContent>
+			</AlertDialogOverlay>
+		</AlertDialog>
+	);
+});

src/pages/_app.tsx

@@ -9,6 +9,7 @@ import useRevalidation from 'src/lib/hooks/use-revalidation';
 import {type CustomNextPage} from 'src/lib/types';
 import MobileDeviceWarning from 'src/components/mobile-device-warning';
 import theme from 'src/lib/theme';
+import {ShutdownWarning} from 'src/components/shutdown-warning';
 
 // eslint-disable-next-line mobx/missing-observer
 const MyApp = ({Component, pageProps}: AppProps & {Component: CustomNextPage<any>}) => {
@@ -39,12 +40,7 @@ const MyApp = ({Component, pageProps}: AppProps & {Component: CustomNextPage<any
 				<meta name='viewport' content='width=device-width, initial-scale=1.0'/>
 
 				<link rel='dns-prefetch' href={process.env.NEXT_PUBLIC_THUMBOR_ENDPOINT}/>
-
-				{
-					process.env.NODE_ENV === 'production' && (
-						<script async defer data-website-id='6d73d07c-c64e-41db-9db7-5688da4d5945' src='https://um.maxisom.me/script.js'/>
-					)
-				}
+				<script async defer data-website-id='6d73d07c-c64e-41db-9db7-5688da4d5945' src='https://um.maxisom.me/script.js'/>
 
 				<link rel='apple-touch-icon' sizes='180x180' href='/images/favicon/apple-touch-icon.png'/>
 				<link rel='icon' type='image/png' sizes='32x32' href='/images/favicon/favicon-32x32.png'/>
@@ -63,6 +59,7 @@ const MyApp = ({Component, pageProps}: AppProps & {Component: CustomNextPage<any
 					<Navbar/>
 
 					<Component {...pageProps}/>
+					<ShutdownWarning/>
 				</Box>
 			</StateProvider>
 

src/pages/about.tsx

@@ -77,27 +77,6 @@ const AboutPage = observer(() => (
 						<Image src={LightningGif} />
 					</VStack>
 				</HStack>
-
-				<Box h={8} />
-
-				<Text as='span'>
-          It currently costs ~$9 / month to host this, so if you found it useful
-          feel free to{' '}
-					<WrappedLink
-						href='https://github.com/sponsors/codetheweb/'
-						display='inline-block'
-					>
-            sponsor me
-					</WrappedLink>{' '}
-          or{' '}
-					<WrappedLink
-						href='https://www.buymeacoffee.com/maxisom'
-						display='inline-block'
-					>
-            buy me a coffee
-					</WrappedLink>
-          .
-				</Text>
 			</VStack>
 
 			<VStack align='flex-start'>