Repository: ArroyoSystems/arroyo (language: rust)

Issue:
View Request - 404 Page for Console
Right now, I don't see any 404 view.  This would be nice to add as we start doing more error handling on the console.


Discussion / hints:

Fix patch:
diff --git a/arroyo-console/src/main.tsx b/arroyo-console/src/main.tsx
index 44fd58d99..352009cea 100644
--- a/arroyo-console/src/main.tsx
+++ b/arroyo-console/src/main.tsx
@@ -20,6 +20,7 @@ import { CreatePipeline } from './routes/pipelines/CreatePipeline';
 import { SinkEditor } from './routes/sinks/CreateSink';
 
 import { addCloudRoutes, createRoot, getClient, needsOrgSetup } from './lib/CloudComponents';
+import PageNotFound from './routes/not_found/PageNotFound';
 
 export type ApiClient = () => Promise<PromiseClient<typeof ApiGrpc>>;
 
@@ -32,6 +33,10 @@ export function Router(): JSX.Element {
   const client = getClient();
 
   let routes = [
+    {
+      path: '*',
+      element: <PageNotFound />,
+    },
     {
       path: '',
       element: <Home client={client} />,
diff --git a/arroyo-console/src/routes/not_found/PageNotFound.tsx b/arroyo-console/src/routes/not_found/PageNotFound.tsx
new file mode 100644
index 000000000..0b9940eb2
--- /dev/null
+++ b/arroyo-console/src/routes/not_found/PageNotFound.tsx
@@ -0,0 +1,21 @@
+import React from 'react';
+import { Link, VStack, Text, Icon } from '@chakra-ui/react';
+import { CiFaceFrown } from 'react-icons/all';
+
+const PageNotFound: React.FC = ({}) => {
+  return (
+    <VStack justify={'center'} height={'90vh'} spacing={30}>
+      <Icon as={CiFaceFrown} boxSize={55} />
+      <VStack>
+        <Text fontSize="xl">Sorry, page not found</Text>
+        <Text>
+          <Link color="blue.400" href={'/'}>
+            Go back home
+          </Link>
+        </Text>
+      </VStack>
+    </VStack>
+  );
+};
+
+export default PageNotFound;


Test patch: