@tailor-platform/erp-kit 0.2.0 → 0.2.2

package/templates/scaffold/app/backend/src/generated/kysely-tailordb.ts

@@ -0,0 +1,83 @@
+import {
+  createGetDB,
+  type Generated,
+  type Timestamp,
+  type NamespaceDB,
+  type NamespaceInsertable,
+  type NamespaceSelectable,
+  type NamespaceTable,
+  type NamespaceTableName,
+  type NamespaceTransaction,
+  type NamespaceUpdateable,
+} from "@tailor-platform/sdk/kysely";
+
+export interface Namespace {
+  "main-db": {
+    AuditEvent: {
+      id: Generated<string>;
+      eventType: "USER_CREATED" | "USER_ACTIVATED" | "USER_DEACTIVATED" | "USER_REACTIVATED" | "ROLE_ASSIGNED" | "ROLE_REVOKED" | "PERMISSION_ASSIGNED" | "PERMISSION_REVOKED";
+      actorId: string;
+      targetId: string | null;
+      targetType: string | null;
+      payload: string | null;
+      createdAt: Generated<Timestamp>;
+      updatedAt: Timestamp | null;
+    }
+
+    Permission: {
+      id: Generated<string>;
+      key: string;
+      description: string | null;
+      createdAt: Generated<Timestamp>;
+      updatedAt: Timestamp | null;
+    }
+
+    Role: {
+      id: Generated<string>;
+      name: string;
+      description: string | null;
+      createdAt: Generated<Timestamp>;
+      updatedAt: Timestamp | null;
+    }
+
+    RolePermission: {
+      id: Generated<string>;
+      roleId: string;
+      permissionId: string;
+      createdAt: Generated<Timestamp>;
+      updatedAt: Timestamp | null;
+    }
+
+    User: {
+      id: Generated<string>;
+      email: string;
+      name: string;
+      status: "PENDING" | "ACTIVE" | "INACTIVE";
+      permissions: string[] | null;
+      createdAt: Generated<Timestamp>;
+      updatedAt: Timestamp | null;
+    }
+
+    UserRole: {
+      id: Generated<string>;
+      userId: string;
+      roleId: string;
+      createdAt: Generated<Timestamp>;
+      updatedAt: Timestamp | null;
+    }
+  }
+}
+
+export const getDB = createGetDB<Namespace>();
+
+export type DB<N extends keyof Namespace = keyof Namespace> = NamespaceDB<Namespace, N>;
+
+export type Transaction<K extends keyof Namespace | DB = keyof Namespace> =
+  NamespaceTransaction<Namespace, K>;
+
+type TableName = NamespaceTableName<Namespace>;
+export type Table<T extends TableName> = NamespaceTable<Namespace, T>;
+
+export type Insertable<T extends TableName> = NamespaceInsertable<Namespace, T>;
+export type Selectable<T extends TableName> = NamespaceSelectable<Namespace, T>;
+export type Updateable<T extends TableName> = NamespaceUpdateable<Namespace, T>;

package/templates/scaffold/app/backend/src/modules.ts

@@ -0,0 +1,9 @@
+import { defineUserManagementModule } from "@tailor-platform/erp-kit/module";
+
+const umModules = defineUserManagementModule({
+  dbNamespace: "main-db",
+});
+
+export const { db: umDb, executors: umExecutors, commands: umCommands } = umModules;
+export const { user, permission, role, userRole, rolePermission } = umDb;
+export const { rolePermissionCreated, rolePermissionDeleted } = umExecutors;

package/templates/scaffold/app/backend/src/resolvers/createUser.ts

@@ -0,0 +1,46 @@
+import { createResolver, t } from "@tailor-platform/sdk";
+import { createContext } from "@tailor-platform/erp-kit/app";
+import { getDB } from "@/generated/kysely-tailordb";
+import { umCommands } from "@/modules";
+
+export default createResolver({
+  name: "createUser",
+  operation: "mutation",
+  input: {
+    name: t.string().description("User name"),
+    email: t.string().description("User email"),
+  },
+  body: async (context) => {
+    const db = getDB("main-db");
+    return db.transaction().execute(async (trx) => {
+      const result = await umCommands.createUser(
+        trx,
+        {
+          email: context.input.email,
+          name: context.input.name,
+        },
+        createContext(context),
+      );
+      if (!result.ok) {
+        switch (result.error.code) {
+          case "USER_MANAGEMENT_MISSING_REQUIRED_FIELD":
+            throw new Error(`Missing required field: ${result.error.message}`);
+          case "USER_MANAGEMENT_INVALID_EMAIL":
+            throw new Error(`Invalid email: ${result.error.message}`);
+          case "USER_MANAGEMENT_USER_ALREADY_EXISTS":
+            throw new Error(`User already exists: ${result.error.message}`);
+          case "INSUFFICIENT_PERMISSION":
+            throw new Error(`Insufficient permission: ${result.error.message}`);
+        }
+      }
+      return {
+        message: `User ${result.value.user.name} created successfully!`,
+      };
+    });
+  },
+  output: t
+    .object({
+      message: t.string().description("Result message"),
+    })
+    .description("Create user response"),
+});

package/templates/scaffold/app/backend/tailor.config.ts

@@ -0,0 +1,68 @@
+import {
+  defineConfig,
+  defineAuth,
+  defineIdp,
+  defineStaticWebSite,
+  definePlugins,
+} from "@tailor-platform/sdk";
+import { kyselyTypePlugin } from "@tailor-platform/sdk/plugin/kysely-type";
+import { seedPlugin } from "@tailor-platform/sdk/plugin/seed";
+import { user } from "@/modules";
+
+const idp = defineIdp("default", {
+  authorization: "loggedIn",
+  clients: ["default"],
+});
+
+const website = defineStaticWebSite("default-web", {
+  description: "Default static website",
+});
+
+const auth = defineAuth("default", {
+  userProfile: {
+    type: user,
+    usernameField: "email",
+    attributes: {
+      permissions: true,
+    },
+  },
+  machineUsers: {
+    developer: {
+      attributes: {
+        permissions: ["ADMIN"],
+      },
+    },
+  },
+  oauth2Clients: {
+    default: {
+      redirectURIs: ["http://localhost:5173", website.url],
+      grantTypes: ["authorization_code", "refresh_token"],
+      clientType: "public",
+      requireDpop: true,
+    },
+  },
+  idProvider: idp.provider(idp.name, "default"),
+});
+
+export default defineConfig({
+  name: "template-app",
+  cors: ["http://localhost:5173", website.url],
+  db: {
+    "main-db": {
+      files: [`./src/modules.ts`],
+      gqlOperations: "query",
+    },
+  },
+  resolver: {
+    "main-resolver": { files: [`./src/resolvers/**/*.ts`] },
+  },
+  executor: { files: [`./src/executors/**/*.ts`] },
+  auth: auth,
+  idp: [idp],
+  staticWebsites: [website],
+});
+
+export const plugins = definePlugins(
+  kyselyTypePlugin({ distPath: "./src/generated/kysely-tailordb.ts" }),
+  seedPlugin({ distPath: "./seed", machineUserName: "developer" }),
+);

package/templates/scaffold/app/backend/tailor.d.ts

@@ -0,0 +1,15 @@
+// This file is auto-generated by @tailor-platform/sdk
+// Do not edit this file manually
+// Regenerated automatically when running 'tailor-sdk apply' or 'tailor-sdk generate'
+
+declare module "@tailor-platform/sdk" {
+  interface AttributeMap {
+    permissions: string[];
+  }
+  interface AttributeList {
+    __tuple?: [];
+  }
+  interface Env {}
+}
+
+export {};

package/templates/scaffold/app/backend/tsconfig.json

@@ -0,0 +1,19 @@
+{
+  "compilerOptions": {
+    "target": "ES2022",
+    "module": "ESNext",
+    "moduleResolution": "bundler",
+    "allowSyntheticDefaultImports": true,
+    "esModuleInterop": true,
+    "allowJs": true,
+    "strict": true,
+    "noEmit": true,
+    "skipLibCheck": true,
+    "resolveJsonModule": true,
+    "types": ["node", "@tailor-platform/function-types"],
+    "paths": {
+      "@/*": ["./src/*"]
+    }
+  },
+  "include": ["**/*.ts"]
+}

package/templates/scaffold/app/frontend/.env.example

@@ -0,0 +1,2 @@
+VITE_TAILOR_APP_URL=<your-app-url>
+VITE_TAILOR_CLIENT_ID=<your-client-id>

package/templates/scaffold/app/frontend/__dot__gitignore

@@ -0,0 +1,3 @@
+.env
+dist/
+node_modules/

package/templates/scaffold/app/frontend/components.json

@@ -0,0 +1,23 @@
+{
+  "$schema": "https://ui.shadcn.com/schema.json",
+  "style": "new-york",
+  "rsc": false,
+  "tsx": true,
+  "tailwind": {
+    "config": "",
+    "css": "src/index.css",
+    "baseColor": "neutral",
+    "cssVariables": true,
+    "prefix": ""
+  },
+  "iconLibrary": "lucide",
+  "rtl": false,
+  "aliases": {
+    "components": "@/components",
+    "utils": "@/lib/utils",
+    "ui": "@/components/ui",
+    "lib": "@/lib",
+    "hooks": "@/hooks"
+  },
+  "registries": {}
+}

package/templates/scaffold/app/frontend/eslint.config.js

@@ -0,0 +1,48 @@
+import eslint from "@eslint/js";
+import { defineConfig, globalIgnores } from "eslint/config";
+import { createTypeScriptImportResolver } from "eslint-import-resolver-typescript";
+import importX from "eslint-plugin-import-x";
+import reactDom from "eslint-plugin-react-dom";
+import reactHooks from "eslint-plugin-react-hooks";
+import reactX from "eslint-plugin-react-x";
+import globals from "globals";
+import tseslint from "typescript-eslint";
+
+export default defineConfig([
+  globalIgnores(["dist/"]),
+  {
+    files: ["**/*.{ts,tsx}"],
+    extends: [
+      eslint.configs.recommended,
+      tseslint.configs.recommendedTypeChecked,
+      tseslint.configs.stylisticTypeChecked,
+      importX.flatConfigs.recommended,
+      importX.flatConfigs.typescript,
+    ],
+    languageOptions: {
+      parserOptions: {
+        projectService: true,
+        tsconfigRootDir: import.meta.dirname,
+      },
+    },
+    settings: {
+      "import-x/resolver-next": [createTypeScriptImportResolver()],
+    },
+    rules: {
+      "import-x/order": "error",
+      "import-x/no-unresolved": ["error", { ignore: ["^@tailor-platform/"] }],
+    },
+  },
+  {
+    files: ["**/*.{ts,tsx}"],
+    extends: [
+      reactX.configs["recommended-typescript"],
+      reactDom.configs.recommended,
+      reactHooks.configs.flat.recommended,
+    ],
+    languageOptions: {
+      ecmaVersion: 2020,
+      globals: globals.browser,
+    },
+  },
+]);

package/templates/scaffold/app/frontend/index.html

@@ -0,0 +1,13 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <link rel="icon" href="/favicon.ico" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>template-app</title>
+  </head>
+  <body>
+    <div id="root"></div>
+    <script type="module" src="/src/main.tsx"></script>
+  </body>
+</html>

package/templates/scaffold/app/frontend/package.json

@@ -0,0 +1,53 @@
+{
+  "name": "template-app-frontend",
+  "private": true,
+  "type": "module",
+  "scripts": {
+    "build": "tsc -b && vite build",
+    "dev": "vite",
+    "preview": "vite preview",
+    "generate": "node --env-file=.env ./scripts/generate-graphql.mjs",
+    "lint": "eslint .",
+    "lint:fix": "eslint --fix .",
+    "typecheck": "tsc --noEmit"
+  },
+  "dependencies": {
+    "@hookform/resolvers": "5.2.2",
+    "@radix-ui/react-label": "2.1.8",
+    "@radix-ui/react-slot": "1.2.4",
+    "@tailor-platform/app-shell": "0.28.0",
+    "class-variance-authority": "0.7.1",
+    "clsx": "2.1.1",
+    "gql.tada": "1.9.0",
+    "lucide-react": "0.563.0",
+    "react": "19.2.4",
+    "react-dom": "19.2.4",
+    "react-hook-form": "7.71.1",
+    "tailwind-merge": "3.4.0",
+    "urql": "5.0.1",
+    "zod": "4.3.6"
+  },
+  "devDependencies": {
+    "@eslint/js": "9.39.4",
+    "@tailor-platform/app-shell-vite-plugin": "0.1.0",
+    "@tailwindcss/vite": "4.1.18",
+    "@types/node": "25.1.0",
+    "@types/react": "19.2.10",
+    "@types/react-dom": "19.2.3",
+    "@vitejs/plugin-react": "5.1.2",
+    "babel-plugin-react-compiler": "1.0.0",
+    "eslint": "9.39.4",
+    "eslint-import-resolver-typescript": "4.4.4",
+    "eslint-plugin-import-x": "4.16.1",
+    "eslint-plugin-react-dom": "2.13.0",
+    "eslint-plugin-react-hooks": "7.0.1",
+    "eslint-plugin-react-x": "2.13.0",
+    "globals": "17.2.0",
+    "shadcn": "^3.8.4",
+    "tailwindcss": "4.1.18",
+    "tw-animate-css": "1.4.0",
+    "typescript": "5.9.3",
+    "typescript-eslint": "8.57.0",
+    "vite": "7.3.1"
+  }
+}

package/templates/scaffold/app/frontend/scripts/generate-graphql.mjs

@@ -0,0 +1,6 @@
+import { execSync } from "node:child_process";
+
+const url = process.env.VITE_TAILOR_APP_URL;
+
+execSync(`pnpm gql-tada generate schema "${url}/query"`);
+execSync("pnpm gql-tada generate output");

package/templates/scaffold/app/frontend/src/App.tsx

@@ -0,0 +1,58 @@
+import {
+  AppShell,
+  AuthProvider,
+  DefaultSidebar,
+  SidebarGroup,
+  SidebarItem,
+  SidebarLayout,
+  useAuth,
+} from "@tailor-platform/app-shell";
+import { GraphQLProvider } from "./providers/graphql-provider";
+import { authClient } from "./lib/auth-client";
+
+const AuthGuard = () => {
+  const { login } = useAuth();
+
+  return (
+    <main className="min-h-screen grid place-items-center px-4">
+      <div className="w-full max-w-sm rounded-lg border bg-card p-6 space-y-4">
+        <h1 className="text-lg font-semibold">Sign in required</h1>
+        <p className="text-sm text-muted-foreground">
+          Continue with your Tailor account to access this app.
+        </p>
+        <button
+          type="button"
+          onClick={() => {
+            void login();
+          }}
+          className="inline-flex h-9 w-full items-center justify-center rounded-md bg-primary px-4 text-sm font-medium text-primary-foreground hover:bg-primary/90"
+        >
+          Sign in
+        </button>
+      </div>
+    </main>
+  );
+};
+
+const App = () => {
+  return (
+    <AuthProvider client={authClient} guardComponent={AuthGuard}>
+      <GraphQLProvider authClient={authClient}>
+        <AppShell>
+          <SidebarLayout
+            sidebar={
+              <DefaultSidebar>
+                <SidebarGroup title="User Management">
+                  <SidebarItem to="/user-management/user" />
+                  <SidebarItem to="/user-management/profile" />
+                </SidebarGroup>
+              </DefaultSidebar>
+            }
+          />
+        </AppShell>
+      </GraphQLProvider>
+    </AuthProvider>
+  );
+};
+
+export default App;

package/templates/scaffold/app/frontend/src/components/composed/empty-state.tsx

@@ -0,0 +1,26 @@
+import type { ReactNode } from "react";
+
+interface EmptyStateProps {
+  title?: string;
+  message?: string;
+  icon?: ReactNode;
+  action?: ReactNode;
+}
+
+export const EmptyState = ({
+  title = "No data",
+  message = "There are no items to display.",
+  icon,
+  action,
+}: EmptyStateProps) => {
+  return (
+    <div className="flex flex-col items-center justify-center gap-4 rounded-lg border border-dashed p-12 text-center">
+      {icon && <div className="text-muted-foreground">{icon}</div>}
+      <div>
+        <h3 className="font-medium">{title}</h3>
+        <p className="mt-1 text-sm text-muted-foreground">{message}</p>
+      </div>
+      {action && <div className="mt-2">{action}</div>}
+    </div>
+  );
+};

package/templates/scaffold/app/frontend/src/components/composed/error-fallback.tsx

@@ -0,0 +1,28 @@
+import { Button } from "../ui/button";
+
+interface ErrorFallbackProps {
+  title?: string;
+  message?: string;
+  onReset?: () => void;
+}
+
+export const ErrorFallback = ({
+  title = "Something went wrong",
+  message = "An error occurred while loading this content.",
+  onReset,
+}: ErrorFallbackProps) => {
+  return (
+    <div className="flex flex-col items-center justify-center gap-4 rounded-lg border border-destructive/20 bg-destructive/5 p-8">
+      <div className="text-center">
+        <h2 className="text-lg font-semibold text-destructive">{title}</h2>
+        <p className="mt-1 text-sm text-muted-foreground">{message}</p>
+      </div>
+
+      {onReset && (
+        <Button variant="outline" onClick={onReset}>
+          Try again
+        </Button>
+      )}
+    </div>
+  );
+};

package/templates/scaffold/app/frontend/src/components/composed/loading.tsx

@@ -0,0 +1,13 @@
+import { Spinner } from "../ui/spinner";
+
+interface LoadingProps {
+  className?: string;
+}
+
+export const Loading = ({ className = "p-8" }: LoadingProps) => {
+  return (
+    <div className={`flex items-center justify-center ${className}`}>
+      <Spinner />
+    </div>
+  );
+};

package/templates/scaffold/app/frontend/src/components/ui/badge.tsx

@@ -0,0 +1,39 @@
+import * as React from "react";
+import { Slot } from "@radix-ui/react-slot";
+import { cva, type VariantProps } from "class-variance-authority";
+
+import { cn } from "../../lib/utils";
+
+const badgeVariants = cva(
+  "inline-flex items-center justify-center rounded-full border px-2 py-0.5 text-xs font-medium w-fit whitespace-nowrap shrink-0 [&>svg]:size-3 gap-1 [&>svg]:pointer-events-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive transition-[color,box-shadow] overflow-hidden",
+  {
+    variants: {
+      variant: {
+        default: "border-transparent bg-primary text-primary-foreground [a&]:hover:bg-primary/90",
+        secondary:
+          "border-transparent bg-secondary text-secondary-foreground [a&]:hover:bg-secondary/90",
+        destructive:
+          "border-transparent bg-destructive text-white [a&]:hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60",
+        outline: "text-foreground [a&]:hover:bg-accent [a&]:hover:text-accent-foreground",
+      },
+    },
+    defaultVariants: {
+      variant: "default",
+    },
+  },
+);
+
+function Badge({
+  className,
+  variant,
+  asChild = false,
+  ...props
+}: React.ComponentProps<"span"> & VariantProps<typeof badgeVariants> & { asChild?: boolean }) {
+  const Comp = asChild ? Slot : "span";
+
+  return (
+    <Comp data-slot="badge" className={cn(badgeVariants({ variant }), className)} {...props} />
+  );
+}
+
+export { Badge, badgeVariants };

package/templates/scaffold/app/frontend/src/components/ui/button.tsx

@@ -0,0 +1,60 @@
+import * as React from "react";
+import { Slot } from "@radix-ui/react-slot";
+import { cva, type VariantProps } from "class-variance-authority";
+
+import { cn } from "../../lib/utils";
+
+const buttonVariants = cva(
+  "inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive",
+  {
+    variants: {
+      variant: {
+        default: "bg-primary text-primary-foreground hover:bg-primary/90",
+        destructive:
+          "bg-destructive text-white hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60",
+        outline:
+          "border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50",
+        secondary: "bg-secondary text-secondary-foreground hover:bg-secondary/80",
+        ghost: "hover:bg-accent hover:text-accent-foreground dark:hover:bg-accent/50",
+        link: "text-primary underline-offset-4 hover:underline",
+      },
+      size: {
+        default: "h-9 px-4 py-2 has-[>svg]:px-3",
+        sm: "h-8 rounded-md gap-1.5 px-3 has-[>svg]:px-2.5",
+        lg: "h-10 rounded-md px-6 has-[>svg]:px-4",
+        icon: "size-9",
+        "icon-sm": "size-8",
+        "icon-lg": "size-10",
+      },
+    },
+    defaultVariants: {
+      variant: "default",
+      size: "default",
+    },
+  },
+);
+
+function Button({
+  className,
+  variant = "default",
+  size = "default",
+  asChild = false,
+  ...props
+}: React.ComponentProps<"button"> &
+  VariantProps<typeof buttonVariants> & {
+    asChild?: boolean;
+  }) {
+  const Comp = asChild ? Slot : "button";
+
+  return (
+    <Comp
+      data-slot="button"
+      data-variant={variant}
+      data-size={size}
+      className={cn(buttonVariants({ variant, size, className }))}
+      {...props}
+    />
+  );
+}
+
+export { Button, buttonVariants };