fix types and fallback (#210)

Author: ewilliams-cloudera

ui/src/components/ErrorComponents/CustomUnhandledError.tsx

@@ -0,0 +1,43 @@
+/*
+ * CLOUDERA APPLIED MACHINE LEARNING PROTOTYPE (AMP)
+ * (C) Cloudera, Inc. 2025
+ * All rights reserved.
+ *
+ * Applicable Open Source License: Apache 2.0
+ *
+ * NOTE: Cloudera open source products are modular software products
+ * made up of hundreds of individual components, each of which was
+ * individually copyrighted.  Each Cloudera open source product is a
+ * collective work under U.S. Copyright Law. Your license to use the
+ * collective work is as provided in your written agreement with
+ * Cloudera.  Used apart from the collective work, this file is
+ * licensed for your use pursuant to the open source license
+ * identified above.
+ *
+ * This code is provided to you pursuant a written agreement with
+ * (i) Cloudera, Inc. or (ii) a third-party authorized to distribute
+ * this code. If you do not have a written agreement with Cloudera nor
+ * with an authorized and properly licensed third party, you do not
+ * have any rights to access nor to use this code.
+ *
+ * Absent a written agreement with Cloudera, Inc. ("Cloudera") to the
+ * contrary, A) CLOUDERA PROVIDES THIS CODE TO YOU WITHOUT WARRANTIES OF ANY
+ * KIND; (B) CLOUDERA DISCLAIMS ANY AND ALL EXPRESS AND IMPLIED
+ * WARRANTIES WITH RESPECT TO THIS CODE, INCLUDING BUT NOT LIMITED TO
+ * IMPLIED WARRANTIES OF TITLE, NON-INFRINGEMENT, MERCHANTABILITY AND
+ * FITNESS FOR A PARTICULAR PURPOSE; (C) CLOUDERA IS NOT LIABLE TO YOU,
+ * AND WILL NOT DEFEND, INDEMNIFY, NOR HOLD YOU HARMLESS FOR ANY CLAIMS
+ * ARISING FROM OR RELATED TO THE CODE; AND (D)WITH RESPECT TO YOUR EXERCISE
+ * OF ANY RIGHTS GRANTED TO YOU FOR THE CODE, CLOUDERA IS NOT LIABLE FOR ANY
+ * DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, PUNITIVE OR
+ * CONSEQUENTIAL DAMAGES INCLUDING, BUT NOT LIMITED TO, DAMAGES
+ * RELATED TO LOST REVENUE, LOST PROFITS, LOSS OF INCOME, LOSS OF
+ * BUSINESS ADVANTAGE OR UNAVAILABILITY, OR LOSS OR CORRUPTION OF
+ * DATA.
+ */
+
+import { ErrorComponent } from "@tanstack/react-router";
+
+export const CustomUnhandledError = ({ error }: { error: Error }) => {
+  return <ErrorComponent error={error} />;
+};

ui/src/components/ErrorComponents/NotFoundComponent.tsx

@@ -0,0 +1,75 @@
+/*
+ * CLOUDERA APPLIED MACHINE LEARNING PROTOTYPE (AMP)
+ * (C) Cloudera, Inc. 2025
+ * All rights reserved.
+ *
+ * Applicable Open Source License: Apache 2.0
+ *
+ * NOTE: Cloudera open source products are modular software products
+ * made up of hundreds of individual components, each of which was
+ * individually copyrighted.  Each Cloudera open source product is a
+ * collective work under U.S. Copyright Law. Your license to use the
+ * collective work is as provided in your written agreement with
+ * Cloudera.  Used apart from the collective work, this file is
+ * licensed for your use pursuant to the open source license
+ * identified above.
+ *
+ * This code is provided to you pursuant a written agreement with
+ * (i) Cloudera, Inc. or (ii) a third-party authorized to distribute
+ * this code. If you do not have a written agreement with Cloudera nor
+ * with an authorized and properly licensed third party, you do not
+ * have any rights to access nor to use this code.
+ *
+ * Absent a written agreement with Cloudera, Inc. ("Cloudera") to the
+ * contrary, A) CLOUDERA PROVIDES THIS CODE TO YOU WITHOUT WARRANTIES OF ANY
+ * KIND; (B) CLOUDERA DISCLAIMS ANY AND ALL EXPRESS AND IMPLIED
+ * WARRANTIES WITH RESPECT TO THIS CODE, INCLUDING BUT NOT LIMITED TO
+ * IMPLIED WARRANTIES OF TITLE, NON-INFRINGEMENT, MERCHANTABILITY AND
+ * FITNESS FOR A PARTICULAR PURPOSE; (C) CLOUDERA IS NOT LIABLE TO YOU,
+ * AND WILL NOT DEFEND, INDEMNIFY, NOR HOLD YOU HARMLESS FOR ANY CLAIMS
+ * ARISING FROM OR RELATED TO THE CODE; AND (D)WITH RESPECT TO YOUR EXERCISE
+ * OF ANY RIGHTS GRANTED TO YOU FOR THE CODE, CLOUDERA IS NOT LIABLE FOR ANY
+ * DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, PUNITIVE OR
+ * CONSEQUENTIAL DAMAGES INCLUDING, BUT NOT LIMITED TO, DAMAGES
+ * RELATED TO LOST REVENUE, LOST PROFITS, LOSS OF INCOME, LOSS OF
+ * BUSINESS ADVANTAGE OR UNAVAILABILITY, OR LOSS OR CORRUPTION OF
+ * DATA.
+ */
+
+import { useNavigate } from "@tanstack/react-router";
+import { Button, Flex, Result } from "antd";
+import Images from "src/components/images/Images.ts";
+
+export const NotFoundComponent = () => {
+  const navigate = useNavigate();
+  return (
+    <Flex
+      align="center"
+      justify="center"
+      style={{ height: "100vh", width: "100%" }}
+    >
+      <Result
+        icon={
+          <img
+            src={Images.image404}
+            alt="Page not found"
+            height={300}
+            style={{ borderRadius: 20 }}
+          />
+        }
+        title="404"
+        subTitle="Sorry, the page you visited does not exist."
+        extra={
+          <Button
+            type="primary"
+            onClick={() => {
+              navigate({ to: "/" }).catch(() => null);
+            }}
+          >
+            Back Home
+          </Button>
+        }
+      />
+    </Flex>
+  );
+};

ui/src/main.tsx

@@ -40,22 +40,21 @@ import React from "react";
 import ReactDOM from "react-dom/client";
 import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
 import { routeTree } from "./routeTree.gen";
-import {
-  createRouter,
-  ErrorComponent,
-  RouterProvider,
-  useNavigate,
-} from "@tanstack/react-router";
+import { createRouter, RouterProvider } from "@tanstack/react-router";
 import "./index.css";
 import { ApiError } from "./api/utils";
-import { Button, Flex, Result, Spin, Typography } from "antd";
-import Images from "src/components/images/Images.ts";
+import { Flex, Spin, Typography } from "antd";
+import { NotFoundComponent } from "src/components/ErrorComponents/NotFoundComponent.tsx";
+import { CustomUnhandledError } from "src/components/ErrorComponents/CustomUnhandledError.tsx";
 
 const queryClient = new QueryClient({
   defaultOptions: {
     queries: {
       retry: (_, error: Error) => {
         if (error instanceof ApiError) {
+          if (error.message.includes("No such file or directory: '/tmp/jwt'")) {
+            return false;
+          }
           return error.status >= 500;
         }
         return true;
@@ -64,44 +63,10 @@ const queryClient = new QueryClient({
   },
 });
 
-export const NotFoundComponent = () => {
-  const navigate = useNavigate();
-  return (
-    <Flex
-      align="center"
-      justify="center"
-      style={{ height: "100vh", width: "100%" }}
-    >
-      <Result
-        icon={
-          <img
-            src={Images.image404}
-            alt="Page not found"
-            height={300}
-            style={{ borderRadius: 20 }}
-          />
-        }
-        title="404"
-        subTitle="Sorry, the page you visited does not exist."
-        extra={
-          <Button
-            type="primary"
-            onClick={() => {
-              navigate({ to: "/" }).catch(() => null);
-            }}
-          >
-            Back Home
-          </Button>
-        }
-      />
-    </Flex>
-  );
-};
-
 const router = createRouter({
   routeTree,
   context: { queryClient: queryClient },
-  defaultErrorComponent: ({ error }) => <ErrorComponent error={error} />,
+  defaultErrorComponent: ({ error }) => <CustomUnhandledError error={error} />,
   defaultNotFoundComponent: () => <NotFoundComponent />,
   defaultPendingComponent: () => (
     <Flex

ui/src/routes/_layout/chats/_layout-chats/projects/$projectId/index.lazy.tsx

@@ -42,7 +42,8 @@ import { ProjectProvider } from "pages/Projects/ProjectContext.tsx";
 import ProjectPage from "pages/Projects/ProjectPage/ProjectPage.tsx";
 import { useSuspenseQuery } from "@tanstack/react-query";
 import { getProjectsQueryOptions } from "src/api/projectsApi.ts";
-import { NotFoundComponent } from "src/main.tsx";
+
+import { NotFoundComponent } from "src/components/ErrorComponents/NotFoundComponent.tsx";
 
 export const Route = createLazyFileRoute(
   "/_layout/chats/_layout-chats/projects/$projectId/",

ui/src/routes/_layout/projects/_layout-projects/$projectId.lazy.tsx

@@ -42,7 +42,8 @@ import { ProjectProvider } from "pages/Projects/ProjectContext.tsx";
 import { Flex } from "antd";
 import { getProjectsQueryOptions } from "src/api/projectsApi.ts";
 import { useSuspenseQuery } from "@tanstack/react-query";
-import { NotFoundComponent } from "src/main.tsx";
+
+import { NotFoundComponent } from "src/components/ErrorComponents/NotFoundComponent.tsx";
 
 export const Route = createLazyFileRoute(
   "/_layout/projects/_layout-projects/$projectId",

ui/src/routes/_layout/settings/_layout-settings/index.lazy.tsx

@@ -38,11 +38,11 @@
 
 import { createLazyFileRoute } from "@tanstack/react-router";
 import SettingsPage from "pages/Settings/SettingsPage.tsx";
-import { NotFoundComponent } from "src/main.tsx";
 import { Flex, Layout, Typography } from "antd";
 import { cdlGray300 } from "src/cuix/variables.ts";
 import { useSuspenseQuery } from "@tanstack/react-query";
 import { getAmpConfigQueryOptions } from "src/api/ampMetadataApi.ts";
+import { NotFoundComponent } from "src/components/ErrorComponents/NotFoundComponent.tsx";
 
 const { Content, Header } = Layout;