Merge pull request #802 from Lemoncode/feature/update-cloud-examples

Feature/update cloud examples

Author: nasdan

07-cloud/01-basic/00-boilerplate/package-lock.json

@@ -1,8 +1,6 @@
 {
-  "name": "04-boilerplate-front",
+  "name": "07-cloud-master-frontend-lemoncode",
   "version": "1.0.0",
-  "description": "Member project",
-  "main": "index.js",
   "type": "module",
   "scripts": {
     "start": "run-p -l type-check:watch start:dev",
@@ -13,38 +11,43 @@
     "test": "vitest run -c ./config/test/config.ts",
     "test:watch": "vitest run -c ./config/test/config.ts"
   },
+  "imports": {
+    "#*": "./src/*"
+  },
   "author": "Lemoncode",
   "license": "MIT",
   "dependencies": {
-    "@emotion/css": "^11.11.2",
-    "@emotion/react": "^11.11.4",
-    "@emotion/styled": "^11.11.0",
+    "@emotion/css": "^11.13.5",
+    "@emotion/react": "^11.14.0",
+    "@emotion/styled": "^11.14.0",
     "@lemoncode/fonk": "^1.5.4",
     "@lemoncode/fonk-formik": "^4.0.1",
-    "@mui/material": "^5.15.12",
-    "axios": "^1.6.7",
-    "formik": "^2.4.5",
-    "react": "^18.2.0",
-    "react-dom": "^18.2.0",
-    "react-router-dom": "^6.22.2"
+    "@mui/material": "^6.4.3",
+    "@tanstack/react-router": "^1.102.1",
+    "axios": "^1.7.9",
+    "formik": "^2.4.6",
+    "react": "^19.0.0",
+    "react-dom": "^19.0.0"
   },
   "devDependencies": {
-    "@emotion/babel-plugin": "^11.11.0",
-    "@testing-library/dom": "^9.3.4",
-    "@testing-library/jest-dom": "^6.4.2",
-    "@testing-library/react": "^14.2.1",
-    "@testing-library/user-event": "^14.5.2",
-    "@types/jest": "^29.5.12",
-    "@types/react": "^18.2.63",
-    "@types/react-dom": "^18.2.19",
+    "@emotion/babel-plugin": "^11.13.5",
+    "@tanstack/router-devtools": "^1.102.1",
+    "@tanstack/router-plugin": "^1.102.1",
+    "@testing-library/dom": "^10.4.0",
+    "@testing-library/jest-dom": "^6.6.3",
+    "@testing-library/react": "^16.2.0",
+    "@testing-library/user-event": "^14.6.1",
+    "@types/jest": "^29.5.14",
+    "@types/react": "^19.0.8",
+    "@types/react-dom": "^19.0.3",
     "@types/react-router-dom": "^5.3.3",
-    "@vitejs/plugin-react": "^4.2.1",
-    "jsdom": "^24.0.0",
+    "@vitejs/plugin-react": "^4.3.4",
+    "jsdom": "^26.0.0",
     "npm-run-all": "^4.1.5",
-    "rimraf": "^5.0.5",
-    "ts-jest": "^29.1.2",
-    "typescript": "^5.3.3",
-    "vite": "^5.1.5",
-    "vitest": "^1.3.1"
+    "rimraf": "^6.0.1",
+    "ts-jest": "^29.2.5",
+    "typescript": "^5.7.3",
+    "vite": "^6.1.0",
+    "vitest": "^3.0.5"
   }
 }

07-cloud/01-basic/00-boilerplate/package.json

@@ -1,11 +1,12 @@
 import React from 'react';
-import { RouterComponent } from '@/core/router';
-import { ThemeProviderComponent } from '@/core/theme';
+import { RouterProvider } from '@tanstack/react-router';
+import { router } from '#core/router';
+import { ThemeProviderComponent } from '#core/theme';
 
 const App: React.FC = () => {
   return (
     <ThemeProviderComponent>
-      <RouterComponent />
+      <RouterProvider router={router} />
     </ThemeProviderComponent>
   );
 };

07-cloud/01-basic/00-boilerplate/src/app.tsx

@@ -1,3 +1,4 @@
-export const envConstants = {
+export const ENV = {
+  IS_PRODUCTION: import.meta.env.PROD,
   ORGANIZATION: import.meta.env.PUBLIC_ORGANIZATION,
 };

07-cloud/01-basic/00-boilerplate/src/common-app/app-bar/app-bar.component.tsx

@@ -1,2 +1,2 @@
-export * from './router.component';
-export * from './routes';
+export * from './router.dev-tools';
+export * from './router';

07-cloud/01-basic/00-boilerplate/src/common-app/app-bar/app-bar.styles.ts

@@ -0,0 +1,111 @@
+/* eslint-disable */
+
+// @ts-nocheck
+
+// noinspection JSUnusedGlobalSymbols
+
+// This file was automatically generated by TanStack Router.
+// You should NOT make any changes in this file as it will be overwritten.
+// Additionally, you should also exclude this file from your linter and/or formatter to prevent it from being checked or modified.
+
+// Import Routes
+
+import { Route as rootRoute } from './../../scenes/__root'
+import { Route as ListImport } from './../../scenes/list'
+import { Route as IndexImport } from './../../scenes/index'
+
+// Create/Update Routes
+
+const ListRoute = ListImport.update({
+  id: '/list',
+  path: '/list',
+  getParentRoute: () => rootRoute,
+} as any)
+
+const IndexRoute = IndexImport.update({
+  id: '/',
+  path: '/',
+  getParentRoute: () => rootRoute,
+} as any)
+
+// Populate the FileRoutesByPath interface
+
+declare module '@tanstack/react-router' {
+  interface FileRoutesByPath {
+    '/': {
+      id: '/'
+      path: '/'
+      fullPath: '/'
+      preLoaderRoute: typeof IndexImport
+      parentRoute: typeof rootRoute
+    }
+    '/list': {
+      id: '/list'
+      path: '/list'
+      fullPath: '/list'
+      preLoaderRoute: typeof ListImport
+      parentRoute: typeof rootRoute
+    }
+  }
+}
+
+// Create and export the route tree
+
+export interface FileRoutesByFullPath {
+  '/': typeof IndexRoute
+  '/list': typeof ListRoute
+}
+
+export interface FileRoutesByTo {
+  '/': typeof IndexRoute
+  '/list': typeof ListRoute
+}
+
+export interface FileRoutesById {
+  __root__: typeof rootRoute
+  '/': typeof IndexRoute
+  '/list': typeof ListRoute
+}
+
+export interface FileRouteTypes {
+  fileRoutesByFullPath: FileRoutesByFullPath
+  fullPaths: '/' | '/list'
+  fileRoutesByTo: FileRoutesByTo
+  to: '/' | '/list'
+  id: '__root__' | '/' | '/list'
+  fileRoutesById: FileRoutesById
+}
+
+export interface RootRouteChildren {
+  IndexRoute: typeof IndexRoute
+  ListRoute: typeof ListRoute
+}
+
+const rootRouteChildren: RootRouteChildren = {
+  IndexRoute: IndexRoute,
+  ListRoute: ListRoute,
+}
+
+export const routeTree = rootRoute
+  ._addFileChildren(rootRouteChildren)
+  ._addFileTypes<FileRouteTypes>()
+
+/* ROUTE_MANIFEST_START
+{
+  "routes": {
+    "__root__": {
+      "filePath": "__root.tsx",
+      "children": [
+        "/",
+        "/list"
+      ]
+    },
+    "/": {
+      "filePath": "index.tsx"
+    },
+    "/list": {
+      "filePath": "list.tsx"
+    }
+  }
+}
+ROUTE_MANIFEST_END */

07-cloud/01-basic/00-boilerplate/src/common-app/app-bar/index.ts

@@ -0,0 +1,10 @@
+import React from 'react';
+import { ENV } from '#core/constants';
+
+export const TanStackRouterDevtools = ENV.IS_PRODUCTION
+  ? () => null // Render nothing in production
+  : React.lazy(() =>
+      import('@tanstack/router-devtools').then(res => ({
+        default: res.TanStackRouterDevtools,
+      }))
+    );

07-cloud/01-basic/00-boilerplate/src/common/components/form/index.ts

@@ -0,0 +1,13 @@
+import { createRouter } from '@tanstack/react-router';
+// The route-tree file is generated automatically. Do not modify this file manually.
+import { routeTree } from './route-tree';
+
+export const router = createRouter({
+  routeTree,
+});
+
+declare module '@tanstack/react-router' {
+  interface Register {
+    router: typeof router;
+  }
+}

07-cloud/01-basic/00-boilerplate/src/common/components/form/text-field/index.ts

@@ -1,4 +1,5 @@
-import ReactDOM from 'react-dom';
+import { createRoot } from 'react-dom/client';
 import App from './app';
 
-ReactDOM.render(<App />, document.getElementById('root'));
+const root = createRoot(document.getElementById('root')!);
+root.render(<App />);