cleanup

.dockerignore

@@ -7,6 +7,8 @@
 !package*
 !remix.config.js
 !tailwind.config.js
+!tailwind-base.js
+!.npmrc
 !scripts
 !public/package.json
 !jsconfig.json
@@ -15,6 +17,7 @@
 !tsconfig-compile.json
 !tsconfig.json
 !remix.env.d.ts
+!css-plugins
 src/generated/node_modules
 src/generated/plugin/node_modules
 src/design-system/node_modules

.eslintrc.yml

@@ -1,7 +1,123 @@
 extends:
-  - ./src/design-system/.eslintrc.yml
+  - airbnb
+  - airbnb/hooks
+  - plugin:react/recommended
+  - plugin:prettier/recommended
+  - plugin:@typescript-eslint/recommended
+
+plugins:
+  - import
+  - react 
+  - prefer-arrow-functions
+  - prettier
+  - "@typescript-eslint"
+
+parser: "@typescript-eslint/parser"
+
+parserOptions:
+  ecmaFeatures:
+    jsx: true
+  ecmaVersion: 12
+  sourceType: module
+
+env:
+  es6: true
+  node: true
+  browser: true
+  jest: true
+  es2021: true
+
+settings:
+  import/resolver:
+    node:  
+      extensions: [.js, .jsx, .ts, .tsx, .json]
+      moduleDirectory:
+        - node_modules
+    jsconfig:
+      config: ./jsconfig.json
+    typescript:
+      project: ./tsconfig.json
+
+# settings:
+#   import/resolver:
+#     node: true
+#     jsconfig:
+#       config: ./jsconfig.json
+
+globals:
+  Logger: false
 
 rules:
-  no-case-declarations: 0
-  no-restricted-syntax: 0
+  # pritter rules
+
+  # ts rules
   react/no-unescaped-entities: 0
+  react/jsx-filename-extension: 0
+  react/require-default-props : 0
+  "@typescript-eslint/no-unused-vars":
+    - error
+    - ignoreRestSiblings: true
+      varsIgnorePattern: '^_'
+      argsIgnorePattern: '^_'
+
+  "@typescript-eslint/no-explicit-any": 0
+  "@typescript-eslint/ban-ts-comment": 0
+  no-shadow: 0
+
+
+  # js rules
+  react/react-in-jsx-scope: 0
+  # prefer-arrow-functions/prefer-arrow-functions:
+  #   [
+  #     "warn",
+  #     {
+  #       classPropertiesAllowed: false,
+  #       disallowPrototype: true,
+  #       returnStyle: "unchanged",
+  #       singleReturnOnly: true,
+  #     },
+  #   ]
+
+  import/extensions: 0
+  import/prefer-default-export: off
+
+  react/jsx-uses-react: 0
+  react/jsx-uses-vars: 1
+  react/jsx-props-no-spreading: 0
+  react/function-component-definition: 0
+  prettier/prettier: 
+    - error
+    - singleQuote: true
+  camelcase:
+    - error 
+    - ignoreDestructuring: true
+      properties: never
+
+  no-underscore-dangle: 0
+
+  react-hooks/exhaustive-deps: 0
+  jsx-a11y/no-static-element-interactions: 0
+  jsx-a11y/click-events-have-key-events: 0
+  allow-named-functions: 0
+  max-classes-per-file: 0
+  react/prop-types: 0
+  react/display-name: 0
+  jsx-a11y/anchor-is-valid: 0
+  import/order: 1
+  react/button-has-type: 0
+  no-console: 0
+  no-param-reassign: 
+    - error
+    - props: false
+  import/no-unresolved:
+    - error
+    - ignore:
+      - \.svg
+
+  import/no-extraneous-dependencies: 0
+
+  no-unused-vars: 
+    - error
+    - ignoreRestSiblings: true
+      varsIgnorePattern: '^_'
+      argsIgnorePattern: '^_'

Dockerfile

@@ -5,6 +5,7 @@ RUN npm i --frozen-lockfile
 
 FROM node:22.10.0-alpine AS install
 RUN npm i -g [email protected]
+RUN apk add gcc python3 make
 WORKDIR  /app
 COPY ./package.json ./package.json
 COPY ./pnpm-lock.yaml ./pnpm-lock.yaml
@@ -34,35 +35,25 @@ COPY ./static/${APP}/. ./public
 # lib
 COPY ./lib ./lib
 
-# design system
-COPY ./src/design-system/components ./src/design-system/components
-COPY ./src/design-system/index.css ./src/design-system/index.css
-COPY ./src/design-system/css ./src/design-system/css
-COPY ./src/design-system/css-plugins ./src/design-system/css-plugins
-COPY ./src/design-system/tailwind-base.js ./src/design-system/tailwind-base.js
-COPY ./src/design-system/tailwind.config.js ./src/design-system/tailwind.config.js
-
 # typecheck
-COPY ./src/design-system/.eslintrc.yml ./src/design-system/.eslintrc.yml
-COPY ./src/design-system/tsconfig.json ./src/design-system/tsconfig.json
-COPY ./src/design-system/jsconfig.json ./src/design-system/jsconfig.json
-COPY ./src/design-system/package.json ./src/design-system/package.json
 COPY ./gql-queries-generator/loader.ts ./gql-queries-generator/loader.ts
 COPY ./fake-data-generator/gen.ts ./fake-data-generator/gen.ts
 COPY ./gql-queries-generator/${APP}.ts ./gql-queries-generator/index.ts
 COPY ./tsconfig-compile.json ./tsconfig-compile.json
 
-RUN ls ./src/design-system
 
 # app
 COPY ./src/apps/${APP} ./src/apps/${APP}
 COPY ./tailwind.config.js ./tailwind.config.js
+COPY ./tailwind-base.js ./tailwind-base.js
 COPY ./remix.config.js ./remix.config.js
 COPY ./pnpm-lock.yaml ./pnpm-lock.yaml
 COPY ./package.json ./package.json
 COPY ./jsconfig.json ./jsconfig.json
 COPY ./tsconfig.json ./tsconfig.json
 COPY ./remix.env.d.ts ./remix.env.d.ts
+COPY ./css-plugins ./css-plugins
+
 RUN pnpm build:ts
 
 FROM node:22.10.0-alpine

Taskfile.yaml

@@ -184,7 +184,7 @@ tasks:
       - docker build --build-arg APP=auth . -t {{.IMAGE}}/auth:{{.tag}}
       - docker push {{.IMAGE}}/auth:{{.tag}}
       - docker build --build-arg APP=console . -t {{.IMAGE}}/console:{{.tag}}
-      - docker push {{.IMAGE}}/console:{{.tag}}
+      # - docker push {{.IMAGE}}/console:{{.tag}}
 
   container-build-webinar:
     preconditions:

package.json

@@ -25,7 +25,7 @@
   },
   "dependencies": {
     "@jengaicons/react": "1.6.0",
-    "@kloudlite/design-system": "^0.0.1",
+    "@kloudlite/design-system": "^0.0.2",
     "@mdx-js/react": "^2.3.0",
     "@monaco-editor/react": "^4.6.0",
     "@oshq/react-select": "^3.2.1",

src/apps/auth/routes/_providers+/signup.tsx

@@ -11,8 +11,8 @@ import {
   useSearchParams,
 } from '@remix-run/react';
 import { RECAPTCHA_SITE_KEY, mainUrl } from '~/auth/consts';
-import { Button } from '@kloudlite/design-system/atoms/button.jsx';
-import { PasswordInput, TextInput } from '@kloudlite/design-system/atoms/input.jsx';
+import { Button } from '@kloudlite/design-system/atoms/button';
+import { PasswordInput, TextInput } from '@kloudlite/design-system/atoms/input';
 import { ArrowLeft, ArrowRight } from '@kloudlite/design-system/icons';
 import { toast } from '@kloudlite/design-system/molecule/toast';
 import { cn } from '@kloudlite/design-system/utils';

src/apps/iot-console/routes/_main+/$account+/$project+/deployments/route.tsx

@@ -1,7 +1,7 @@
 import { Plus } from '~/iotconsole/components/icons';
 import { defer } from '@remix-run/node';
 import { Link, useLoaderData } from '@remix-run/react';
-import { Button } from '@kloudlite/design-system/atoms/button.jsx';
+import { Button } from '@kloudlite/design-system/atoms/button';
 import {
   LoadingComp,
   pWrapper,
@@ -24,7 +24,7 @@ export const loader = (ctx: IRemixCtx) => {
     const { project } = ctx.params;
 
     const { data, errors } = await GQLServerHandler(
-      ctx.request
+      ctx.request,
     ).listIotDeployments({
       pq: getPagination(ctx),
       search: getSearch(ctx),

src/apps/iot-console/routes/_main+/$account+/$project+/deviceblueprints/route.tsx

@@ -2,7 +2,7 @@ import { Plus } from '~/iotconsole/components/icons';
 import { defer } from '@remix-run/node';
 import { Link, useLoaderData } from '@remix-run/react';
 import { useState } from 'react';
-import { Button } from '@kloudlite/design-system/atoms/button.jsx';
+import { Button } from '@kloudlite/design-system/atoms/button';
 import {
   LoadingComp,
   pWrapper,
@@ -23,9 +23,9 @@ export const loader = async (ctx: IRemixCtx) => {
   const { project } = ctx.params;
   const promise = pWrapper(async () => {
     const { data, errors } = await GQLServerHandler(
-      ctx.request
+      ctx.request,
     ).listIotDeviceBlueprints({
-      projectName: 
+      projectName: project,
       pq: getPagination(ctx),
       search: getSearch(ctx),
     });
@@ -56,7 +56,6 @@ const Workspaces = () => {
         // }}
       >
         {({ deviceBlueprintData }) => {
-
           const deviceBlueprints = parseNodes(deviceBlueprintData);
 
           if (!deviceBlueprints) {

src/apps/iot-console/routes/_main+/$account+/projects/route.tsx

@@ -1,7 +1,7 @@
 import { Plus } from '~/iotconsole/components/icons';
 import { defer } from '@remix-run/node';
 import { Link, useLoaderData, useParams } from '@remix-run/react';
-import { Button } from '@kloudlite/design-system/atoms/button.jsx';
+import { Button } from '@kloudlite/design-system/atoms/button';
 import {
   LoadingComp,
   pWrapper,
@@ -22,7 +22,7 @@ export const loader = (ctx: IRemixCtx) => {
     ensureAccountSet(ctx);
 
     const { data: projects, errors } = await GQLServerHandler(
-      ctx.request
+      ctx.request,
     ).listIotProjects({
       pq: getPagination(ctx),
       search: getSearch(ctx),

src/generated/.eslintrc.yml

@@ -1,5 +1,5 @@
 extends:
-  - ../design-system/.eslintrc.yml
+  - ../.eslintrc.yml
 
 rules:
   camelcase: 0