@gadmin2n/cli 0.0.81 → 0.0.83

package/.yalc/@gadmin2n/schematics/dist/lib/application/files/gadmin2-game-angle-demo/web/src/routes/user/components/role-tag.tsx

@@ -0,0 +1,48 @@
+import React from "react";
+
+import { CrownOutlined, StarOutlined, UserOutlined } from "@ant-design/icons";
+import { Tag, type TagProps } from "antd";
+
+type Props = {
+  role: any;
+};
+
+export const RoleTag: React.FC<Props> = ({ role }) => {
+  const variants: {
+    [key in any]: {
+      color: TagProps["color"];
+      icon: React.ReactNode;
+    };
+  } = {
+    ADMIN: {
+      color: "red",
+      icon: <CrownOutlined />,
+    },
+    SALES_INTERN: {
+      color: "blue",
+      icon: <UserOutlined />,
+    },
+    SALES_PERSON: {
+      color: "geekblue",
+      icon: <UserOutlined />,
+    },
+    SALES_MANAGER: {
+      color: "cyan",
+      icon: <StarOutlined />,
+    },
+  };
+
+  const text = role.replace("_", " ").toLowerCase();
+
+  return (
+    <Tag
+      style={{
+        textTransform: "capitalize",
+      }}
+      color={variants[role].color}
+      icon={variants[role].icon}
+    >
+      {text}
+    </Tag>
+  );
+};

package/.yalc/@gadmin2n/schematics/dist/lib/application/files/gadmin2-game-angle-demo/web/src/routes/user/components/show-drawer.tsx

@@ -0,0 +1,140 @@
+import React from "react";
+
+import { TagField } from "@refinedev/antd";
+import { useShow } from "@refinedev/core";
+
+import { CloseOutlined } from "@ant-design/icons";
+import { Button, Drawer, Space, Tag, Typography } from "antd";
+import dayjs from "dayjs";
+
+import styles from "styles/show-drawer.module.css";
+import { User } from "types";
+
+import { UserSelect } from "../queries";
+
+const { Title, Text } = Typography;
+
+interface ShowDrawerProps {
+  id?: number;
+  onClose: () => void;
+}
+
+export const ShowDrawer: React.FC<ShowDrawerProps> = ({ id, onClose }) => {
+  const { query } = useShow<User>({
+    resource: "user",
+    id,
+    meta: {
+      select: UserSelect,
+    },
+  });
+
+  const { data, isLoading, isError } = query;
+
+  if (isError) {
+    onClose();
+    return null;
+  }
+
+  const {
+    userid,
+    username,
+    roles,
+    isApiKey,
+    apiKey,
+    description,
+    isActive,
+    lastUsedAt,
+    creator,
+    createdAt,
+    updatedAt,
+  } = data?.data ?? {};
+
+  return (
+    <Drawer
+      open
+      onClose={onClose}
+      loading={isLoading}
+      width={756}
+      styles={{
+        body: { background: "#f5f5f5", padding: 0 },
+        header: { display: "none" },
+      }}
+    >
+      <div className={styles.header}>
+        <Button type="text" icon={<CloseOutlined />} onClick={onClose} />
+      </div>
+      <div className={styles.container}>
+        <div key="id">
+          <Title level={5}>ID</Title>
+          <Text>{id}</Text>
+        </div>
+        <div key="userid">
+          <Title level={5}>User ID</Title>
+          <Text>{userid}</Text>
+        </div>
+        <div key="username">
+          <Title level={5}>User Name</Title>
+          <Text>{username || "-"}</Text>
+        </div>
+        <div key="roles">
+          <Title level={5}>Roles</Title>
+          <Space>
+            {(Array.isArray(roles) ? roles : JSON.parse(roles || "[]"))?.map?.(
+              (v: string) => (
+                <TagField key={v} value={String(v)} />
+              )
+            )}
+          </Space>
+        </div>
+        <div key="isApiKey">
+          <Title level={5}>Is API Key</Title>
+          <Tag color={isApiKey ? "blue" : "default"}>
+            {isApiKey ? "Yes" : "No"}
+          </Tag>
+        </div>
+        {isApiKey && (
+          <>
+            <div key="apiKey">
+              <Title level={5}>API Key</Title>
+              <Text copyable={{ text: apiKey || "" }} style={{ fontFamily: "monospace" }}>
+                {apiKey || "-"}
+              </Text>
+            </div>
+            <div key="description">
+              <Title level={5}>Description</Title>
+              <Text>{description || "-"}</Text>
+            </div>
+            <div key="lastUsedAt">
+              <Title level={5}>Last Used At</Title>
+              <Text>
+                {lastUsedAt ? dayjs(lastUsedAt).format("YYYY-MM-DD HH:mm:ss") : "-"}
+              </Text>
+            </div>
+          </>
+        )}
+        <div key="isActive">
+          <Title level={5}>Is Active</Title>
+          <Tag color={isActive ? "green" : "red"}>
+            {isActive ? "Active" : "Inactive"}
+          </Tag>
+        </div>
+        <div key="creator">
+          <Title level={5}>Creator</Title>
+          <Text>{creator || "-"}</Text>
+        </div>
+        <div key="createdAt">
+          <Title level={5}>Created At</Title>
+          <Text>
+            {createdAt ? dayjs(createdAt).format("YYYY-MM-DD HH:mm:ss") : "-"}
+          </Text>
+        </div>
+        <div key="updatedAt">
+          <Title level={5}>Updated At</Title>
+          <Text>
+            {updatedAt ? dayjs(updatedAt).format("YYYY-MM-DD HH:mm:ss") : "-"}
+          </Text>
+        </div>
+      </div>
+    </Drawer>
+  );
+};

package/.yalc/@gadmin2n/schematics/dist/lib/application/files/gadmin2-game-angle-demo/web/src/routes/user/create.tsx

@@ -0,0 +1,113 @@
+
+import {
+  FieldDataType,
+  handleInitialValues,
+  handleOnFinish,
+  ModelType,
+  produceModel,
+} from '@gadmin2n/react-common';
+import { Create, useFileUploadState, useForm } from "@refinedev/antd";
+import { Form } from "antd";
+import { IResourceComponentsProps, useApiUrl, useTranslate } from "@refinedev/core";
+import React, { useContext, useState } from "react";
+import { getFormItem, onFormValuesChange } from "../../helpers";
+import { modelsMap, modelsEnum } from "../../generated/models.index";
+import {
+  userFormConfig as formConfig,
+  userFormPrismaSelect as formPrismaSelect,
+} from "../../generated/props/user/config";
+import {
+  userModel,
+  useRelation,
+} from "../../generated/props/user/model";
+import { User } from "../../generated/types/prisma.types";
+import { UserForm as transformClass } from "../../generated/props/user/form.validator";
+import { BusinessContext } from 'components/contexts/business';
+
+export const UserCreate: React.FC<IResourceComponentsProps> = () => {
+  const resourceName = "user";
+  const t = useTranslate();
+  
+  
+
+  const [[fields, model]] = useState(() => {
+    const model: ModelType = produceModel(
+      userModel,
+      {
+        // all formItem attrs surport, https://ant.design/components/form#formitem
+        // description : { component : <MDEditor data-color-mode="light" /> },
+        // status : { normalize : (value: any) => value ? "1" : "0" },
+        // cron: {validator: { validator: runCronValidator },},
+      },
+      transformClass
+    );
+
+    const fields: FieldDataType[] = formConfig.fields
+      .map((fieldName: string) => model[fieldName])
+      .filter((field: FieldDataType) => field);
+
+    return [fields, model] as const;
+  });
+
+  const { formProps, saveButtonProps, onFinish, form } =
+    useForm<User>({
+      meta: { select: formPrismaSelect},
+    });
+  if (formProps.initialValues || formConfig.initialValues) {
+    formProps.initialValues = handleInitialValues(
+      formProps.initialValues || formConfig.initialValues || {},
+      fields,
+    );
+  }
+
+  const apiUrl = useApiUrl();
+  const { isLoading, onChange } = useFileUploadState();
+  const relationSelectProps = useRelation(modelsMap);
+
+  return (
+    <Create
+      saveButtonProps={{
+        ...saveButtonProps,
+        disabled: isLoading,
+      }}
+    >
+      <Form
+        {...formProps}
+        validateTrigger="onBlur"
+        onFinish={(values) => {
+          onFinish(
+            handleOnFinish(
+              {
+                ...values,
+                
+              },
+              fields
+            )
+          );
+        }}
+        layout="vertical"
+        form={form}
+        onValuesChange={onFormValuesChange(
+          form,
+          formConfig.reaction,
+        )}
+      >
+        {fields.map((field) => {
+          return getFormItem(
+            field,
+            resourceName,
+            t,
+            form,
+            formConfig.reaction,
+            modelsEnum,
+            model,
+            apiUrl,
+            relationSelectProps,
+            onChange
+          );
+        })}
+      </Form>
+    </Create>
+  );
+};
+  

package/.yalc/@gadmin2n/schematics/dist/lib/application/files/gadmin2-game-angle-demo/web/src/routes/user/edit.tsx

@@ -0,0 +1,122 @@
+
+import {
+  FieldDataType,
+  handleInitialValues,
+  handleOnFinish,
+  ModelType,
+  produceModel,
+} from "@gadmin2n/react-common";
+import { Edit, ListButton, RefreshButton, useFileUploadState, useForm } from "@refinedev/antd";
+import { Form } from "antd";
+import { IResourceComponentsProps, useApiUrl, useParsed, useTranslate } from "@refinedev/core";
+import { getFormItem, onFormValuesChange } from "../../helpers";
+import React, { useContext, useState } from "react";
+
+import { modelsMap, modelsEnum } from "../../generated/models.index";
+import {
+  userFormConfig as formConfig,
+  userFormPrismaSelect as formPrismaSelect,
+} from "../../generated/props/user/config";
+import {
+  userModel,
+  useRelation,
+} from "../../generated/props/user/model";
+import { User } from "../../generated/types/prisma.types";
+import { UserForm as transformClass } from "../../generated/props/user/form.validator";
+import { BusinessContext } from 'components/contexts/business';
+
+export const UserEdit: React.FC<IResourceComponentsProps> = () => {
+  const resourceName = "user";
+  const t = useTranslate();
+  
+
+  const [[fields, model]] = useState(() => {
+    const model: ModelType = produceModel(
+      userModel,
+      {
+        // all formItem attrs surport, https://ant.design/components/form#formitem
+        // description : { component : <MDEditor data-color-mode="light" /> },
+        // status : { normalize : (value: any) => value ? "1" : "0" },
+        // cron: {validator: { validator: runCronValidator },},
+      },
+      transformClass
+    );
+
+    const fields: FieldDataType[] = formConfig.fields
+      .map((fieldName: string) => model[fieldName])
+      .filter((field: FieldDataType) => field);
+
+    return [fields, model] as const;
+  });
+
+  const { formProps, saveButtonProps, onFinish, form } =
+    useForm<User>({
+      meta: { select: formPrismaSelect},
+    });
+  formProps.initialValues = handleInitialValues(
+    formProps.initialValues || {},
+    fields
+  );
+
+  const apiUrl = useApiUrl();
+  const { isLoading, onChange } = useFileUploadState();
+
+  const relationSelectProps = useRelation(modelsMap);
+
+  return (
+    <Edit
+      saveButtonProps={{
+        ...saveButtonProps,
+        disabled: isLoading,
+      }}
+      headerButtons={
+        <>
+          <ListButton />
+          <RefreshButton
+            meta={{ select: formPrismaSelect}}
+          />
+        </>
+      }
+    >
+      <Form
+        {...formProps}
+        validateTrigger="onBlur"
+        onFinish={(values) => {
+          onFinish(
+            handleOnFinish(
+              {
+                ...values,
+                
+                id: undefined,
+              },
+              fields,
+              "edit"
+            )
+          );
+        }}
+        layout="vertical"
+        form={form}
+        onValuesChange={onFormValuesChange(
+          form,
+          formConfig.reaction,
+        )}
+      >
+        {fields.map((field) => {
+          return getFormItem(
+            field,
+            resourceName,
+            t,
+            form,
+            formConfig.reaction,
+            modelsEnum,
+            model,
+            apiUrl,
+            relationSelectProps,
+            onChange
+          );
+        })}
+      </Form>
+    </Edit>
+  );
+};
+  

package/.yalc/@gadmin2n/schematics/dist/lib/application/files/gadmin2-game-angle-demo/web/src/routes/user/index.tsx

@@ -0,0 +1,6 @@
+
+export * from "./list";
+export * from "./create";
+export * from "./edit";
+export * from "./show";
+