Flow View and project settings

graphql.config.yml

@@ -3,4 +3,4 @@ documents: '**/*.graphql'
 extensions:
   endpoints:
     Default GraphQL Endpoint:
-      url: http://localhost:3001/graphql
+      url: http://localhost:3010/graphql

package.json

@@ -15,12 +15,13 @@
   },
   "dependencies": {
     "@apollo/client": "^4.0.9",
-    "@code0-tech/pictor": "^0.0.0-mvp.31",
+    "@code0-tech/pictor": "^0.0.0-mvp.45",
+    "date-fns": "^4.1.0",
     "graphql": "^16.12.0",
     "graphql-tag": "^2.12.6",
-    "next": "16.0.7",
-    "react": "19.2.0",
-    "react-dom": "19.2.0",
+    "next": "16.1.5",
+    "react": "19.2.3",
+    "react-dom": "19.2.3",
     "rxjs": "^7.8.2",
     "sass": "^1.93.3"
   },
@@ -30,7 +31,7 @@
     "@types/react-dom": "^19",
     "babel-plugin-react-compiler": "^1.0.0",
     "eslint": "^9",
-    "eslint-config-next": "16.0.7",
+    "eslint-config-next": "16.1.5",
     "typescript": "^5"
   }
 }

src/app/(auth)/email/page.tsx

@@ -1,5 +1,5 @@
 import React from "react";
-import {UserEmailVerificationPage} from "@edition/auth/UserEmailVerificationPage";
+import {UserEmailVerificationPage} from "@edition/user/pages/UserEmailVerificationPage";
 
 export default function Page() {
     return <UserEmailVerificationPage/>

src/app/(auth)/layout.tsx

@@ -1,12 +1,13 @@
 "use client"
 
 import {Col, Container, ContextStoreProvider, DFullScreen, DUserView, Flex, Text} from "@code0-tech/pictor";
-import {UserService} from "@edition/user/User.service";
+import {UserService} from "@edition/user/services/User.service";
 import {useApolloClient} from "@apollo/client/react";
 import {GraphqlClient} from "@core/util/graphql-client";
 import Image from "next/image";
 import React from "react";
 import {usePersistentReactiveArrayService} from "@/hooks/usePersistentReactiveArrayService";
+import {View} from "@code0-tech/pictor/dist/utils/view";
 
 export default function AuthLayout({children}: Readonly<{ children: React.ReactNode }>) {
 

src/app/(auth)/login/page.tsx

@@ -1,5 +1,5 @@
 import React from "react";
-import {UserLoginPage} from "@edition/auth/UserLoginPage";
+import {UserLoginPage} from "@edition/user/pages/UserLoginPage";
 
 export default function Page() {
     return <UserLoginPage/>

src/app/(auth)/password/page.tsx

@@ -1,5 +1,5 @@
 import React from "react";
-import {UserForgotPasswordPage} from "@edition/auth/UserForgotPasswordPage";
+import {UserForgotPasswordPage} from "@edition/user/pages/UserForgotPasswordPage";
 
 export default function Page() {
     return <UserForgotPasswordPage/>

src/app/(auth)/password/reset/page.tsx

@@ -1,5 +1,5 @@
 import React from "react";
-import {UserResetPasswordPage} from "@edition/auth/UserResetPasswordPage";
+import {UserResetPasswordPage} from "@edition/user/pages/UserResetPasswordPage";
 
 export default function Page() {
     return <UserResetPasswordPage/>

src/app/(auth)/register/page.tsx

@@ -1,5 +1,5 @@
 import React from "react";
-import {UserRegistrationPage} from "@edition/auth/UserRegistrationPage";
+import {UserRegistrationPage} from "@edition/user/pages/UserRegistrationPage";
 
 export default function Page() {
     return <UserRegistrationPage/>

src/app/(dashboard)/@bar/default.tsx

@@ -1,7 +1,7 @@
 "use client";
 
 import React from "react";
-import {ApplicationBarView} from "@edition/dashboard/application/ApplicationBarView";
+import {ApplicationBarView} from "@edition/application/ApplicationBarView";
 
 const Page = () => {
     return <ApplicationBarView/>

src/app/(dashboard)/@tab/namespace/[namespaceId]/members/default.tsx

@@ -1,4 +1,4 @@
-import {NamespaceTabView} from "@edition/dashboard/namespace/NamespaceTabView";
+import {NamespaceTabView} from "@edition/namespace/views/NamespaceTabView";
 
 export default function Page() {
     return <NamespaceTabView/>

src/app/(dashboard)/@tab/namespace/[namespaceId]/page.tsx

@@ -1,4 +1,4 @@
-import {NamespaceTabView} from "@edition/dashboard/namespace/NamespaceTabView";
+import {NamespaceTabView} from "@edition/namespace/views/NamespaceTabView";
 
 export default function Page() {
     return <NamespaceTabView/>

src/app/(dashboard)/@tab/namespace/[namespaceId]/projects/default.tsx

@@ -1,4 +1,4 @@
-import {NamespaceTabView} from "@edition/dashboard/namespace/NamespaceTabView";
+import {NamespaceTabView} from "@edition/namespace/views/NamespaceTabView";
 
 export default function Page() {
     return <NamespaceTabView/>

src/app/(dashboard)/@tab/namespace/[namespaceId]/roles/default.tsx

@@ -1,4 +1,4 @@
-import {NamespaceTabView} from "@edition/dashboard/namespace/NamespaceTabView";
+import {NamespaceTabView} from "@edition/namespace/views/NamespaceTabView";
 
 export default function Page() {
     return <NamespaceTabView/>

src/app/(dashboard)/@tab/namespace/[namespaceId]/runtimes/default.tsx

@@ -1,4 +1,4 @@
-import {NamespaceTabView} from "@edition/dashboard/namespace/NamespaceTabView";
+import {NamespaceTabView} from "@edition/namespace/views/NamespaceTabView";
 
 export default function Page() {
     return <NamespaceTabView/>

src/app/(dashboard)/@tab/namespace/[namespaceId]/settings/default.tsx

@@ -1,4 +1,4 @@
-import {NamespaceTabView} from "@edition/dashboard/namespace/NamespaceTabView";
+import {NamespaceTabView} from "@edition/namespace/views/NamespaceTabView";
 
 export default function Page() {
     return <NamespaceTabView/>

src/app/(dashboard)/@tab/organizations/default.tsx

@@ -1,7 +1,7 @@
 "use client"
 
 import React from "react";
-import {ApplicationTabView} from "@edition/dashboard/application/ApplicationTabView";
+import {ApplicationTabView} from "@edition/application/ApplicationTabView";
 
 const Page: React.FC = () => {
     return <ApplicationTabView/>

src/app/(dashboard)/@tab/page.tsx

@@ -1,7 +1,7 @@
 "use client"
 
 import React from "react";
-import {ApplicationTabView} from "@edition/dashboard/application/ApplicationTabView";
+import {ApplicationTabView} from "@edition/application/ApplicationTabView";
 
 const Page: React.FC = () => {
     return <ApplicationTabView/>

src/app/(dashboard)/@tab/runtimes/default.tsx

@@ -1,7 +1,7 @@
 "use client"
 
 import React from "react";
-import {ApplicationTabView} from "@edition/dashboard/application/ApplicationTabView";
+import {ApplicationTabView} from "@edition/application/ApplicationTabView";
 
 const Page: React.FC = () => {
     return <ApplicationTabView/>

src/app/(dashboard)/@tab/settings/page.tsx

@@ -1,7 +1,7 @@
 "use client"
 
 import React from "react";
-import {ApplicationTabView} from "@edition/dashboard/application/ApplicationTabView";
+import {ApplicationTabView} from "@edition/application/ApplicationTabView";
 
 const Page: React.FC = () => {
     return <ApplicationTabView/>

src/app/(dashboard)/@tab/users/page.tsx

@@ -1,7 +1,7 @@
 "use client"
 
 import React from "react";
-import {ApplicationTabView} from "@edition/dashboard/application/ApplicationTabView";
+import {ApplicationTabView} from "@edition/application/ApplicationTabView";
 
 const Page: React.FC = () => {
     return <ApplicationTabView/>

src/app/(dashboard)/layout.tsx

@@ -3,28 +3,30 @@
 import React from "react";
 import {useApolloClient} from "@apollo/client/react";
 import {
-    Container,
+    AuroraBackground,
     ContextStoreProvider,
     DLayout,
-    DNamespaceMemberView, DNamespaceProjectView,
+    DNamespaceMemberView,
+    DNamespaceProjectView,
+    DNamespaceRoleView,
     DNamespaceView,
-    DOrganizationView, DRuntimeView,
+    DOrganizationView,
+    DRuntimeView,
     DUserView,
-    ReactiveArrayStore,
-    useUserSession,
-    DNamespaceRoleView
+    Flex,
+    useUserSession
 } from "@code0-tech/pictor";
-import {UserService} from "@edition/user/User.service";
+import {UserService} from "@edition/user/services/User.service";
 import {GraphqlClient} from "@core/util/graphql-client";
 import {useRouter} from "next/navigation";
-import {OrganizationService} from "@edition/organization/Organization.service";
-import {MemberService} from "@edition/member/Member.service";
-import {NamespaceService} from "@edition/namespace/Namespace.service";
+import {OrganizationService} from "@edition/organization/services/Organization.service";
+import {MemberService} from "@edition/member/services/Member.service";
+import {NamespaceService} from "@edition/namespace/services/Namespace.service";
 import {usePersistentReactiveArrayService} from "@/hooks/usePersistentReactiveArrayService";
-import {RuntimeService} from "@edition/runtime/Runtime.service";
-import {ProjectService} from "@edition/project/Project.service";
-import {RoleService} from "@edition/role/Role.service";
-import {Spacing} from "@code0-tech/pictor/dist/components/spacing/Spacing";
+import {RuntimeService} from "@edition/runtime/services/Runtime.service";
+import {ProjectService} from "@edition/project/services/Project.service";
+import {RoleService} from "@edition/role/services/Role.service";
+import Image from "next/image";
 
 interface ApplicationLayoutProps {
     children: React.ReactNode
@@ -40,28 +42,50 @@ const ApplicationLayout: React.FC<ApplicationLayoutProps> = ({children, bar, tab
 
     const graphqlClient = React.useMemo(() => new GraphqlClient(client), [client])
 
-    const user = usePersistentReactiveArrayService<DUserView, UserService>(`dashboard::users::${currentSession?.id}`, (store: ReactiveArrayStore<DUserView>) => new UserService(graphqlClient, store))
-    const organization = usePersistentReactiveArrayService<DOrganizationView, OrganizationService>(`dashboard::organizations::${currentSession?.id}`, (store: ReactiveArrayStore<DOrganizationView>) => new OrganizationService(graphqlClient, store))
-    const member = usePersistentReactiveArrayService<DNamespaceMemberView, MemberService>(`dashboard::members::${currentSession?.id}`, (store: ReactiveArrayStore<DNamespaceMemberView>) => new MemberService(graphqlClient, store))
-    const namespace = usePersistentReactiveArrayService<DNamespaceView, NamespaceService>(`dashboard::namespaces::${currentSession?.id}`, (store: ReactiveArrayStore<DNamespaceView>) => new NamespaceService(graphqlClient, store))
-    const runtime = usePersistentReactiveArrayService<DRuntimeView, RuntimeService>(`dashboard::global_runtimes::${currentSession?.id}`, (store: ReactiveArrayStore<DRuntimeView>) => new RuntimeService(graphqlClient, store))
-    const project = usePersistentReactiveArrayService<DNamespaceProjectView, ProjectService>(`dashboard::projects::${currentSession?.id}`, (store: ReactiveArrayStore<DNamespaceProjectView>) => new ProjectService(graphqlClient, store))
-    const role = usePersistentReactiveArrayService<DNamespaceRoleView, RoleService>(`dashboard::roles::${currentSession?.id}`, (store: ReactiveArrayStore<DNamespaceRoleView>) => new RoleService(graphqlClient, store))
+    const user = usePersistentReactiveArrayService<DUserView, UserService>(`dashboard::users::${currentSession?.id}`, (store) => new UserService(graphqlClient, store))
+    const organization = usePersistentReactiveArrayService<DOrganizationView, OrganizationService>(`dashboard::organizations::${currentSession?.id}`, (store) => new OrganizationService(graphqlClient, store))
+    const member = usePersistentReactiveArrayService<DNamespaceMemberView, MemberService>(`dashboard::members::${currentSession?.id}`, (store) => new MemberService(graphqlClient, store))
+    const namespace = usePersistentReactiveArrayService<DNamespaceView, NamespaceService>(`dashboard::namespaces::${currentSession?.id}`, (store) => new NamespaceService(graphqlClient, store))
+    const runtime = usePersistentReactiveArrayService<DRuntimeView, RuntimeService>(`dashboard::global_runtimes::${currentSession?.id}`, (store) => new RuntimeService(graphqlClient, store))
+    const project = usePersistentReactiveArrayService<DNamespaceProjectView, ProjectService>(`dashboard::projects::${currentSession?.id}`, (store) => new ProjectService(graphqlClient, store))
+    const role = usePersistentReactiveArrayService<DNamespaceRoleView, RoleService>(`dashboard::roles::${currentSession?.id}`, (store) => new RoleService(graphqlClient, store))
 
     if (currentSession === null) router.push("/login")
 
     return <ContextStoreProvider services={[user, organization, member, namespace, runtime, project, role]}>
-        <DLayout style={{zIndex: 0}} topContent={
-            <>
-                <div style={{background: "rgba(255,2552,255,.1)", borderBottom: "1px solid rgba(255,2552,255,.1)"}}>
-                    {bar}
-                    {tab}
+        <DLayout style={{zIndex: 0}} layoutGap={"0"} showLayoutSplitter={false} leftContent={
+            <Flex p={0.7} pt={1} align={"center"} style={{flexDirection: "column", gap: "0.7rem"}}>
+                <div style={{
+                    position: "absolute",
+                    top: 0,
+                    left: 0,
+                    width: "50%",
+                    transform: "scaleX(-1)",
+                    height: "40%",
+                    zIndex: "-1",
+                }}>
+                    <div style={{
+                        position: "absolute",
+                        top: "0",
+                        left: "0",
+                        width: "100%",
+                        height: "100%",
+                        background: "radial-gradient(circle at top right,rgba(25, 24, 37, 0.25) 0%, rgba(25, 24, 37, 1) 25%)",
+                        zIndex: "1"
+                    }}/>
+                    <AuroraBackground/>
+
                 </div>
-            </>
+                <Image src={"/CodeZero_Logo.png"} alt={"CodeZero Banner"} width={160} height={0}
+                       style={{width: '38px', height: 'auto'}}/>
+                {tab}
+            </Flex>
         }>
-            <Container h={"100%"} w={"100%"}>
-                {children}
-            </Container>
+            <DLayout px={0.7} layoutGap={"0"} topContent={<>{bar}</>}>
+                <DLayout>
+                    <>{children}</>
+                </DLayout>
+            </DLayout>
         </DLayout>
     </ContextStoreProvider>
 }

src/app/(dashboard)/namespace/[namespaceId]/members/add/page.tsx

@@ -1,6 +1,6 @@
 "use client"
 
-import {MemberAddPage} from "@edition/dashboard/member/MemberAddPage";
+import {MemberAddPage} from "@edition/member/pages/MemberAddPage";
 
 export default function Page() {
     return <MemberAddPage/>

src/app/(dashboard)/namespace/[namespaceId]/members/page.tsx

@@ -1,6 +1,6 @@
 "use client"
 
-import {MembersPage} from "@edition/dashboard/member/MembersPage";
+import {MembersPage} from "@edition/member/pages/MembersPage";
 
 export default function Page() {
     return <MembersPage/>

src/app/(dashboard)/namespace/[namespaceId]/page.tsx

@@ -1,6 +1,6 @@
 "use client"
 
-import {NamespaceOverviewPage} from "@edition/dashboard/namespace/NamespaceOverviewPage";
+import {NamespaceOverviewPage} from "@edition/namespace/pages/NamespaceOverviewPage";
 
 export default function Page() {
     return <NamespaceOverviewPage/>

src/app/(dashboard)/namespace/[namespaceId]/projects/create/page.tsx

@@ -1,4 +1,4 @@
-import {NamespaceProjectsCreatePage} from "@edition/dashboard/namespace/NamespaceProjectsCreatePage";
+import {NamespaceProjectsCreatePage} from "@edition/namespace/pages/NamespaceProjectsCreatePage";
 
 export default function Page() {
     return <NamespaceProjectsCreatePage/>

src/app/(dashboard)/namespace/[namespaceId]/projects/page.tsx

@@ -1,4 +1,4 @@
-import {NamespaceProjectsPage} from "@edition/dashboard/namespace/NamespaceProjectsPage";
+import {NamespaceProjectsPage} from "@edition/namespace/pages/NamespaceProjectsPage";
 
 export default function Page() {
     return <NamespaceProjectsPage/>

src/app/(dashboard)/namespace/[namespaceId]/roles/[roleId]/settings/page.tsx

@@ -1,6 +1,6 @@
 "use client"
 
-import {RoleSettingsPage} from "@edition/dashboard/role/RoleSettingsPage";
+import {RoleSettingsPage} from "@edition/role/pages/RoleSettingsPage";
 
 export default function Page() {
     return <RoleSettingsPage/>

src/app/(dashboard)/namespace/[namespaceId]/roles/create/page.tsx

@@ -1,6 +1,6 @@
 "use client"
 
-import {RoleCreatePage} from "@edition/dashboard/role/RoleCreatePage";
+import {RoleCreatePage} from "@edition/role/pages/RoleCreatePage";
 
 export default function Page() {
     return <RoleCreatePage/>

src/app/(dashboard)/namespace/[namespaceId]/roles/page.tsx

@@ -1,5 +1,13 @@
-import {RolesPage} from "@edition/dashboard/role/RolesPage";
+import {RolesPage} from "@edition/role/pages/RolesPage";
 
 export default function Page() {
-    return <RolesPage/>
+    return <div style={{
+        background: "#070514",
+        height: "100%",
+        padding: "1rem",
+        borderTopLeftRadius: "1rem",
+        borderTopRightRadius: "1rem"
+    }}>
+        <RolesPage/>
+    </div>
 }

src/app/(dashboard)/namespace/[namespaceId]/runtimes/[runtimeId]/settings/page.tsx

@@ -1,4 +1,4 @@
-import {RuntimeSettingsPage} from "@edition/dashboard/runtime/RuntimeSettingsPage";
+import {RuntimeSettingsPage} from "@edition/runtime/pages/RuntimeSettingsPage";
 
 export default function Page() {
     return <RuntimeSettingsPage/>

src/app/(dashboard)/namespace/[namespaceId]/runtimes/create/page.tsx

@@ -1,4 +1,4 @@
-import {RuntimeCreatePage} from "@edition/dashboard/runtime/RuntimeCreatePage";
+import {RuntimeCreatePage} from "@edition/runtime/pages/RuntimeCreatePage";
 
 export default function Page() {
     return <RuntimeCreatePage/>

src/app/(dashboard)/namespace/[namespaceId]/runtimes/page.tsx

@@ -1,4 +1,4 @@
-import {RuntimesPage} from "@edition/dashboard/runtime/RuntimesPage";
+import {RuntimesPage} from "@edition/runtime/pages/RuntimesPage";
 
 export default function Page() {
     return <RuntimesPage/>

src/app/(dashboard)/namespace/[namespaceId]/settings/page.tsx

@@ -1,6 +1,6 @@
 "use client"
 
-import {OrganizationSettingsPage} from "@edition/dashboard/organization/OrganizationSettingsPage";
+import {OrganizationSettingsPage} from "@edition/organization/pages/OrganizationSettingsPage";
 
 export default function Page() {
     return <OrganizationSettingsPage/>

src/app/(dashboard)/organizations/create/page.tsx

@@ -1,4 +1,4 @@
-import {OrganizationCreatePage} from "@edition/dashboard/organization/OrganizationCreatePage";
+import {OrganizationCreatePage} from "@edition/organization/pages/OrganizationCreatePage";
 
 export default function Page() {
     return <OrganizationCreatePage/>

src/app/(dashboard)/organizations/page.tsx

@@ -1,4 +1,4 @@
-import {OrganizationsPage} from "@edition/dashboard/organization/OrganizationsPage";
+import {OrganizationsPage} from "@edition/organization/pages/OrganizationsPage";
 
 export default function Page() {
     return <OrganizationsPage/>