Merge branch 'main' into guoda-improve-toolbar

Author: guoda-puidokaite

.changeset/happy-pigs-think.md

@@ -0,0 +1,5 @@
+---
+"@cloudoperators/juno-app-greenhouse": patch
+---
+
+Correctly extract organisation name from URL with basePath and add TypeScript types and Zod validation for auth system.

.changeset/little-kiwis-work.md

@@ -0,0 +1,5 @@
+---
+
+---
+
+1368 franz uxdocs signin update

.changeset/many-meteors-add.md

@@ -0,0 +1,5 @@
+---
+"@cloudoperators/juno-app-greenhouse": patch
+---
+
+Migrate YamlViewer from @uiw/react-codemirror to native CodeMirror packages

.changeset/stale-onions-know.md

@@ -0,0 +1,5 @@
+---
+
+---
+
+feat(docs): add first version of sign-in ux docs page

.changeset/three-ravens-knock.md

@@ -0,0 +1,5 @@
+---
+"@cloudoperators/juno-ui-components": patch
+---
+
+feat(ui): switch Modal default button sequence

apps/greenhouse/README.md

@@ -52,6 +52,8 @@ These are the customizable application properties (appProps) that you can define
 - **demoOrg** (optional): `"demo"`. If the organization name matches this value, the app will use the demo user token for authentication.
 - **demoUserToken** (optional): `"token for demo user"`. Used for authentication if `demoOrg` and `demoUserToken` are set, and the organization name matches `demoOrg`.
   **Note:** This is ignored if `mockAuth` is set.
+- **basePath** (optional, default: `/`):  
+  Specifies the root path under which the application is served. Useful for deploying the app to a subdirectory. If not provided, defaults to the root path `/`.
 
 ## Contributing
 

apps/greenhouse/package.json

@@ -47,6 +47,7 @@
     "clean:cache": "rm -rf .turbo"
   },
   "dependencies": {
+    "@cloudoperators/greenhouse-auth-provider": "workspace:*",
     "@cloudoperators/juno-app-doop": "workspace:*",
     "@cloudoperators/juno-app-heureka": "workspace:*",
     "@cloudoperators/juno-app-supernova": "workspace:*",
@@ -55,12 +56,15 @@
     "@cloudoperators/juno-oauth": "workspace:*",
     "@cloudoperators/juno-ui-components": "workspace:*",
     "@cloudoperators/juno-url-state-provider": "workspace:*",
-    "@cloudoperators/greenhouse-auth-provider": "workspace:*",
-    "@codemirror/lang-yaml": "6.1.2",
+    "@codemirror/lang-yaml": "^6.1.2",
+    "@codemirror/language": "^6.12.2",
+    "@codemirror/state": "^6.5.4",
+    "@codemirror/theme-one-dark": "^6.1.2",
+    "@codemirror/view": "^6.39.15",
     "@tanstack/react-query": "5.90.21",
     "@tanstack/react-router": "1.161.3",
-    "@uiw/react-codemirror": "4.25.4",
     "js-yaml": "4.1.1",
-    "lodash": "4.17.23"
+    "lodash": "4.17.23",
+    "zod": "4.3.6"
   }
 }

apps/greenhouse/src/Shell.tsx

@@ -15,6 +15,8 @@ import styles from "./styles.css?inline"
 import StoreProvider, { useGlobalsApiEndpoint } from "./components/StoreProvider"
 import { AuthProvider, useAuth } from "./components/AuthProvider"
 import { routeTree } from "./routeTree.gen"
+import { getRouterBasePath } from "./utils/organizationResolver"
+import type { AuthContextValue, MockAuthValue } from "./types/auth"
 
 // Create a new query client instance
 const queryClient = new QueryClient()
@@ -43,35 +45,21 @@ export type AppProps = {
   authClientId?: string
   authIssuerUrl?: string
   demoOrg?: string
-  mockAuth?: boolean
+  mockAuth?: MockAuthValue
   demoUserToken?: string
   currentHost?: string
   enableHashedRouting?: boolean
+  basePath?: string
 }
 
-const getBasePath = (auth: any) => {
-  // Determine if org is part of the domain
-  const currentUrl = new URL(window.location.href)
-  const organizationIsPartOfDomain = currentUrl.host.match(/^(.+)\.dashboard\..+/)
-  if (organizationIsPartOfDomain) {
-    return "/"
-  }
-  // If the organization is not part of the domain, extract it from the auth token
-  const orgString = auth?.data?.raw.groups?.find((g: any) => g.indexOf("organization:") === 0)
-  return orgString ? orgString.split(":")[1] : undefined
-}
-
-const getUser = (auth: unknown) => ({
-  // @ts-expect-error - auth?.data type needs to be properly defined
-  organization: auth?.data?.raw?.groups?.find((g: any) => g.startsWith("organization:"))?.split(":")[1] ?? "",
-  // @ts-expect-error - auth?.data type needs to be properly defined
+const getUser = (auth: AuthContextValue) => ({
+  organization: auth?.data?.raw?.groups?.find((g) => g.startsWith("organization:"))?.split(":")[1] ?? "",
   supportGroups: auth?.data?.parsed?.supportGroups ?? [],
 })
 
 function App(props: AppProps) {
   const auth = useAuth()
   const apiEndpoint = useGlobalsApiEndpoint()
-  // @ts-expect-error - useAuth return type is not properly typed
   const token = auth?.data?.JWT
   // Create k8s client if apiEndpoint and token are available
   // @ts-expect-error - apiEndpoint type needs to be properly typed as string
@@ -85,7 +73,7 @@ function App(props: AppProps) {
    * want the app to use browser history.
    */
   router.update({
-    basepath: getBasePath(auth),
+    basepath: getRouterBasePath(auth?.data?.raw?.groups, props.basePath),
     context: { appProps: props, apiClient, user },
     stringifySearch: encodeV2,
     parseSearch: decodeV2,

apps/greenhouse/src/components/Auth.tsx

@@ -19,7 +19,6 @@ import { useAuth } from "./AuthProvider"
  *
  */
 const Auth = ({ children }: any) => {
-  // @ts-expect-error TS(2339): Property 'isProcessing' does not exist on type 'un... Remove this comment to see the full error message
   const { isProcessing: authIsProcessing, loggedIn: authLoggedIn, error: authError, login } = useAuth()
 
   if (authLoggedIn) {

apps/greenhouse/src/components/AuthProvider.test.tsx

@@ -23,11 +23,8 @@ describe("AuthProvider", () => {
     it("initializes default the oidc session but return error because no issuerUrl or clientId provided", () => {
       const wrapper = ({ children }: any) => <AuthProvider options={{}}>{children}</AuthProvider>
       const { result } = renderHook(() => useAuth(), { wrapper })
-      // @ts-expect-error TS(2531): Object is possibly 'null'.
       expect(result.current.loggedIn).toBe(false)
-      // @ts-expect-error TS(2531): Object is possibly 'null'.
       expect(result.current.isDemoMode).toBe(false)
-      // @ts-expect-error TS(2531): Object is possibly 'null'.
       expect(result.current.error).not.toBe(null)
     })
   })
@@ -107,6 +104,52 @@ describe("AuthProvider", () => {
       // @ts-expect-error TS(2531): Object is possibly 'null'.
       expect(result.current.data.parsed.groups).toEqual(mockAuthData.groups)
     })
+
+    it("preserves case in JSON string mockAuth data", () => {
+      const replaceStateSpy = vi.spyOn(window.history, "replaceState").mockImplementation(() => {})
+
+      // Test with mixed-case data that should NOT be lowercased
+      const mockAuthData = {
+        email: "Jane.Doe@Example.com",
+        name: "Jane Doe",
+        groups: ["organization:TestOrg", "team:DevTeam"],
+      }
+      const mockAuthDataString = JSON.stringify(mockAuthData)
+
+      const wrapper = ({ children }: any) => (
+        <AuthProvider options={{ mockAuth: mockAuthDataString }}>{children}</AuthProvider>
+      )
+
+      const { result } = renderHook(() => useAuth(), { wrapper })
+
+      expect(replaceStateSpy).toHaveBeenCalledTimes(1)
+      // @ts-expect-error TS(2531): Object is possibly 'null'.
+      expect(result.current.data.raw.email).toEqual("Jane.Doe@Example.com")
+      // @ts-expect-error TS(2531): Object is possibly 'null'.
+      expect(result.current.data.raw.name).toEqual("Jane Doe")
+      // @ts-expect-error TS(2531): Object is possibly 'null'.
+      expect(result.current.data.raw.groups).toContain("organization:TestOrg")
+    })
+
+    it("rejects invalid mockAuth values (number, array, etc)", () => {
+      const consoleWarnSpy = vi.spyOn(console, "warn").mockImplementation(() => {})
+
+      // Test with number (invalid)
+      const wrapper1 = ({ children }: any) => <AuthProvider options={{ mockAuth: 123 }}>{children}</AuthProvider>
+      const { result: result1 } = renderHook(() => useAuth(), { wrapper: wrapper1 })
+      expect(result1.current.loggedIn).toBe(false)
+      expect(consoleWarnSpy).toHaveBeenCalledWith(expect.stringContaining("Invalid mockAuth value"), 123)
+
+      consoleWarnSpy.mockClear()
+
+      // Test with array (invalid)
+      const wrapper2 = ({ children }: any) => <AuthProvider options={{ mockAuth: [1, 2, 3] }}>{children}</AuthProvider>
+      const { result: result2 } = renderHook(() => useAuth(), { wrapper: wrapper2 })
+      expect(result2.current.loggedIn).toBe(false)
+      expect(consoleWarnSpy).toHaveBeenCalledWith(expect.stringContaining("Invalid mockAuth value"), [1, 2, 3])
+
+      consoleWarnSpy.mockRestore()
+    })
   })
 
   describe("initializes demo auth session", () => {