@akanjs/cli 0.0.34 → 0.0.36

package/assets/assets/app/tsconfig.json.template

@@ -0,0 +1,22 @@
+{
+  "extends": "../../tsconfig.json",
+  "compilerOptions": {
+    "allowJs": true,
+    "strict": false,
+    "noEmit": true,
+    "incremental": true,
+    "resolveJsonModule": true,
+    "jsx": "preserve",
+    "plugins": [
+      {
+        "name": "next",
+      },
+    ],
+  },
+  "include": ["./**/*.ts", "./**/*.tsx", ".next/types/**/*.ts"],
+  "references": [
+    {
+      "path": "./tsconfig.spec.json",
+    },
+  ],
+}

package/assets/assets/app/tsconfig.spec.json.template

@@ -0,0 +1,7 @@
+{
+  "extends": "./tsconfig.json",
+  "compilerOptions": {
+    "types": ["jest", "node"]
+  },
+  "include": ["jest.config.ts", "**/*.test.ts"]
+}

package/assets/assets/app/ui/Footer.tsx.template

@@ -0,0 +1,36 @@
+import { Image, Link } from "@util/ui";
+
+export const Footer = () => {
+  return (
+    <div className="relative justify-center px-2 pb-12 mt-12 bg-[#f3f3f3] via-secondary-focus to-accent-focus">
+      <div className="container py-10">
+        <div className="justify-between mt-6 md:flex md:mt-10 sm:mt-0">
+          <Link href="/" disabled>
+            <Image src="/logo.svg" className="object-contain fill-black" width={200} height={36} />
+          </Link>
+          <div className="flex gap-4 mt-6 text-xs md:mt-0 md:text-base ">
+            <Link href="/termsofservice">
+              <span className="text-[#777777]">이용약관</span>
+            </Link>
+            <Link href="/privacy">
+              <span className="text-[#777777]">개인정보처리방침</span>
+            </Link>
+          </div>
+        </div>
+        <div className="items-center justify-between mt-6 text-sm md:text-base md:mt-3 md:flex ">
+          <div className="flex flex-col text-xs md:text-base gap-1 text-[#777777]">
+            퍼핀플래닛(주) | 선강민 | 서울특별시 강남구 선릉로 555, 선릉빌딩 505호
+          </div>
+          <div>
+            <div className="flex gap-4 mt-6 text-xs md:text-base md:mt-0">
+              <span className="text-[#777]">문의</span>
+              <a href="mailto:hello@puffinplace.com">
+                <span className="text-[#777]">hello@puffinplace.com</span>
+              </a>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  );
+};

package/assets/assets/app/ui/MainHeader.tsx.template

@@ -0,0 +1,100 @@
+import { usePage } from "@<%= appName %>/client";
+import {
+  AiOutlineBuild,
+  AiOutlineEdit,
+  AiOutlineHome,
+  AiOutlinePoweroff,
+  AiOutlinePrinter,
+  AiOutlineRobot,
+  AiOutlineSecurityScan,
+  AiOutlineSend,
+  AiOutlineUser,
+  AiOutlineWindows,
+} from "react-icons/ai";
+import { User } from "@shared/client";
+import { Layout, Link } from "@util/ui";
+import { ReactNode } from "react";
+import { clsx } from "@akanjs/client";
+
+type DirType = "home" | "send" | "print" | "self";
+
+const iconMap: { [key in DirType]: ReactNode } = {
+  home: <AiOutlineHome />,
+  send: <AiOutlineSend />,
+  print: <AiOutlinePrinter />,
+  self: <AiOutlineUser />,
+};
+
+interface MainHeaderProps {
+  className?: string;
+  children?: any;
+  items: {
+    type: DirType;
+    name: string;
+    href?: string;
+  }[];
+  type?: "view" | "edit" | "new";
+}
+export const MainHeader = ({ className, children, items, type = "view" }: MainHeaderProps) => {
+  const { l } = usePage();
+  return (
+    <Layout.Header
+      className={clsx("fixed left-0 px-2 py-2 bg-base-100/50 backdrop-blur-sm flex items-center gap-2", className)}
+    >
+      <Layout.Sider>
+        <div className="text-4xl font-lemonmilk w-full text-center my-8"><%= AppName %></div>
+        <ul className="menu p-4 w-full bg-base-200 text-base-content">
+          {/* <li>
+            <User.Zone.Profile/>
+          </li> */}
+          <li>
+            <Link href="/location" className="flex gap-2 items-center text-lg">
+              {iconMap.home} Home
+            </Link>
+          </li>
+          <li>
+            <Link href="/self" className="flex gap-2 items-center text-lg">
+              {iconMap.self} My Profile
+            </Link>
+          </li>
+          <li>
+            <User.Util.Signout href="/" className="flex gap-2 items-center text-lg text-warning">
+              <AiOutlinePoweroff /> Sign out
+            </User.Util.Signout>
+          </li>
+        </ul>
+      </Layout.Sider>
+      <div className="text-sm breadcrumbs hidden md:block">
+        <ul>
+          {items.slice(0, -2).map(({ type, name, href }, idx) => (
+            <li key={idx}>
+              <Link className="flex gap-1 items-center" href={href}>
+                {iconMap[type]} {name}
+              </Link>
+            </li>
+          ))}
+          <li></li>
+        </ul>
+      </div>
+      <div className="text-sm breadcrumbs -ml-2">
+        <ul>
+          {items.slice(-2).map(({ type, name, href }, idx) => (
+            <li key={idx}>
+              <Link className="flex gap-1 items-center" href={href}>
+                {iconMap[type]} {name}
+              </Link>
+            </li>
+          ))}
+          {type === "new" ? (
+            <li>+ {l("shared.new")}</li>
+          ) : type === "edit" ? (
+            <li className="flex gap-1 items-center">
+              <AiOutlineEdit /> {l("shared.edit")}
+            </li>
+          ) : null}
+        </ul>
+      </div>
+      {children}
+    </Layout.Header>
+  );
+};

package/assets/assets/app/ui/index.ts.template

@@ -0,0 +1,2 @@
+export { MainHeader } from "./MainHeader";
+export { Footer } from "./Footer";

package/assets/assets/crudPages/[__model__Id]/edit/page.tsx.template

@@ -0,0 +1,42 @@
+import { AiOutlineTeam } from "react-icons/ai";
+import { Load } from "@shared/ui";
+import { fetch, usePage, <%= Model %> } from "<%= clientPath %>";
+import type { CsrConfig } from "@akanjs/client";
+
+interface PageProps {
+  params: { <%= model %>Id: string };
+}
+
+export default function Page({ params }: PageProps) {
+  const { l } = usePage();
+  return (
+    <Load.Page
+      of={Page}
+      loader={async () => {
+        const { <%= model %>Id } = await params;
+        const { <%= model %>, <%= model %>Edit } = await fetch.edit<%= Model %>(<%= model %>Id);
+        return { <%= model %>, <%= model %>Edit } as const;
+      }}
+      render={({ <%= model %>, <%= model %>Edit }) => (
+        <div className="container">
+          <div className="flex justify-between m-4 mt-8">
+            <div className="text-xl text-primary flex gap-2 items-center">
+              <AiOutlineTeam /> {l("shared.updateModel", { model: l("<%= model %>.modelName") })}
+            </div>
+          </div>
+          <Load.Edit
+            className="flex flex-col items-center"
+            sliceName="<%= model %>InPublic"
+            edit={<%= model %>Edit}
+            type="form"
+            onCancel="back"
+            onSubmit="/<%= model %>"
+          >
+            <<%= Model %>.Template.General />
+          </Load.Edit>
+        </div>
+      )}
+    />
+  );
+}
+Page.csrConfig = { transition: "none" } satisfies CsrConfig;

package/assets/assets/crudPages/[__model__Id]/page.tsx.template

@@ -0,0 +1,52 @@
+import { <%= Model %>, fetch, usePage } from "<%= clientPath %>";
+import { Link } from "@util/ui";
+import { Load } from "@shared/ui";
+import { getSelf } from "@akanjs/client";
+import { AiOutlineEdit } from "react-icons/ai";
+import type { CsrConfig } from "@akanjs/client";
+
+interface PageProps {
+  params: { <%= model %>Id: string };
+}
+
+export async function generateMetadata({ params }: PageProps) {
+  const { <%= model %>Id } = await params;
+  const { <%= model %> } = await fetch.view<%= Model %>(<%= model %>Id);
+  return {
+    title: <%= model %>.id,
+    description: <%= model %>.id,
+    openGraph: {
+      title: <%= model %>.id,
+      description: <%= model %>.id,
+      // images: <%= model %>.thumbnails.map((i) => i.url),
+    },
+  };
+}
+export default function Page({ params }: PageProps) {
+  const { l } = usePage();
+  const self = getSelf({ unauthorize: "/signin" });
+  return (
+    <Load.Page
+      of={Page}
+      loader={async () => {
+        const { <%= model %>Id } = await params;
+        const { <%= model %>, <%= model %>View } = await fetch.view<%= Model %>(<%= model %>Id);
+        return { <%= model %>, <%= model %>View } as const;
+      }}
+      render={({ <%= model %>, <%= model %>View }) => (
+        <div className="container flex flex-col gap-4">
+          <div className="flex gap-4 font-bold text-lg items-center">
+            <<%= Model %>.Zone.View view={<%= model %>View} />
+            <Link href={`/<%= model %>/${<%= model %>.id}/edit`}>
+              <button className="btn">
+                <AiOutlineEdit />
+                {l("shared.updateModel", { model: l("<%= model %>.modelName") })}
+              </button>
+            </Link>
+          </div>
+        </div>
+      )}
+    />
+  );
+}
+Page.csrConfig = { transition: "none" } satisfies CsrConfig;

package/assets/assets/crudPages/new/page.tsx.template

@@ -0,0 +1,39 @@
+import { AiOutlineTeam } from "react-icons/ai";
+import { Load } from "@shared/ui";
+import { cnst, fetch, usePage, <%= Model %> } from "<%= clientPath %>";
+import { getSelf } from "@akanjs/client";
+import type { CsrConfig } from "@akanjs/client";
+
+export default function Page() {
+  const { l } = usePage();
+  const self = getSelf({ unauthorize: "/signin" });
+  return (
+    <Load.Page
+      of={Page}
+      loader={async () => {
+        const <%= model %>Form: Partial<cnst.<%= Model %>> = {};
+        return { <%= model %>Form } as const;
+      }}
+      render={({ <%= model %>Form }) => (
+        <div className="container">
+          <div className="flex justify-between m-4 mt-8">
+            <div className="text-xl text-primary flex gap-2 items-center">
+              <AiOutlineTeam /> {l("shared.createModel", { model: l("<%= model %>.modelName") })}
+            </div>
+          </div>
+          <Load.Edit
+            className="flex flex-col items-center"
+            sliceName="<%= model %>InPublic"
+            edit={<%= model %>Form}
+            type="form"
+            onCancel="back"
+            onSubmit="/<%= model %>"
+          >
+            <<%= Model %>.Template.General />
+          </Load.Edit>
+        </div>
+      )}
+    />
+  );
+}
+Page.csrConfig = { transition: "none" } satisfies CsrConfig;

package/assets/assets/crudPages/page.tsx.template

@@ -0,0 +1,40 @@
+import { <%= Model %>, fetch, usePage } from "<%= clientPath %>";
+import { Link } from "@util/ui";
+import { Load } from "@shared/ui";
+import { getSelf } from "@akanjs/client";
+import type { CsrConfig } from "@akanjs/client";
+
+export default function Page() {
+  const { l } = usePage();
+  const self = getSelf({ unauthorize: "/signin" });
+  return (
+    <Load.Page
+      of={Page}
+      loader={async () => {
+        const { <%= model %>InitInPublic } = await fetch.init<%= Model %>InPublic();
+        return { <%= model %>InitInPublic } as const;
+      }}
+      render={({ <%= model %>InitInPublic }) => (
+        <div className="container flex flex-col gap-4">
+          <div className="w-full mt-5 px-5 h-full ">
+            <div>{l("<%= model %>.modelName")}</div>
+            <div className="animate-fadeIn px-4 pt-4 flex gap-4 items-center">
+              <div className="font-bold text-lg md:text-4xl"><%= Model %>s</div>
+              <Link href={`/<%= model %>/new`}>
+                <button className="btn">+ {l("shared.createModel", { model: l("<%= model %>.modelName") })}</button>
+              </Link>
+            </div>
+            <div>{l("<%= model %>.modelDesc")}</div>
+            <div className="flex px-6 mt-3 gap-4">
+              <<%= Model %>.Zone.Card
+                className="animate-fadeIn grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 2xl:grid-cols-5 justify-center gap-4 w-full"
+                init={<%= model %>InitInPublic}
+              />
+            </div>
+          </div>
+        </div>
+      )}
+    />
+  );
+}
+Page.csrConfig = { transition: "none" } satisfies CsrConfig;

package/assets/assets/lib/.gitignore.template

@@ -0,0 +1,15 @@
+**/script.ts
+**/script*.ts
+**/.env
+**/env.client.debug.ts*
+**/env.client.develop.ts*
+**/env.client.main.ts*
+**/env.client.testing.ts*
+**/env.server.debug.ts*
+**/env.server.develop.ts*
+**/env.server.main.ts*
+**/env.server.testing.ts*
+
+# System Files
+.DS_Store
+Thumbs.db

package/assets/assets/lib/jest.config.ts.template

@@ -0,0 +1,7 @@
+import "tsconfig-paths/register";
+
+import { withBase } from "@akanjs/test/src/jest.config.base";
+
+const config = withBase("platform");
+
+export default config;

package/assets/assets/lib/package.json.template

@@ -0,0 +1,5 @@
+{
+  "name": "@platform",
+  "version": "0.0.1",
+  "type": "commonjs"
+}

package/assets/assets/lib/project.json.template

@@ -0,0 +1,10 @@
+{
+  "name": "platform",
+  "$schema": "../../node_modules/nx/schemas/project-schema.json",
+  "sourceRoot": "libs/platform",
+  "projectType": "library",
+  "targets": {
+    "test": { "executor": "@nx/jest:jest" },
+    "lint": { "executor": "@nx/eslint:lint" }
+  }
+}

package/assets/assets/lib/tsconfig.json.template

@@ -0,0 +1,11 @@
+{
+  "extends": "../../tsconfig.json",
+  "compilerOptions": {
+    "jsx": "preserve"
+  },
+  "references": [
+    {
+      "path": "./tsconfig.spec.json"
+    }
+  ]
+}

package/assets/assets/lib/tsconfig.spec.json.template

@@ -0,0 +1,7 @@
+{
+  "extends": "./tsconfig.json",
+  "compilerOptions": {
+    "types": ["jest", "node"]
+  },
+  "include": ["jest.config.ts", "**/*.test.ts"]
+}

package/assets/assets/module/__Model__.Template.tsx.template

@@ -0,0 +1,23 @@
+"use client";
+import { cnst, st, usePage } from "<%= clientPath %>";
+import { Field } from "@shared/ui";
+import { Layout } from "@util/ui";
+
+interface <%= Model %>EditProps {
+  <%= model %>Id?: string | null;
+}
+
+export const General = ({ <%= model %>Id = undefined }: <%= Model %>EditProps) => {
+  const <%= model %>Form = st.use.<%= model %>Form();
+  const { l } = usePage();
+  return (
+    <Layout.Template>
+      <Field.Text
+        label={l.field("<%= model %>", "id")}
+        desc={l.desc("<%= model %>", "id")}
+        value={<%= model %>Form.id}
+        onChange={st.do.setIdOn<%= Model %>}
+      />
+    </Layout.Template>
+  );
+};

package/assets/assets/module/__Model__.Unit.tsx.template

@@ -0,0 +1,11 @@
+import { ModelProps } from "@akanjs/client";
+import { cnst, <%= Model %> } from "<%= clientPath %>";
+import { Link } from "@util/ui";
+
+export const Card = ({ <%= model %>, href }: ModelProps<"<%= model %>", cnst.Light<%= Model %>>) => {
+  return (
+    <Link href={href} className="animate-fadeIn w-full h-36 flex rounded-lg shadow-sm hover:shadow-lg duration-300">
+      <div>{<%= model %>.id}</div>
+    </Link>
+  );
+};

package/assets/assets/module/__Model__.Util.tsx.template

@@ -0,0 +1,39 @@
+"use client";
+import { ModelDashboardProps, ModelInsightProps } from "@akanjs/client";
+import { getQueryMap } from "@akanjs/constant";
+import { cnst } from "<%= clientPath %>";
+import { Data } from "@shared/ui";
+
+export const Stat = ({
+  className,
+  summary,
+  sliceName = "<%= model %>",
+  queryMap = getQueryMap(cnst.<%= Model %>Summary),
+  hidePresents,
+}: ModelDashboardProps<cnst.Summary>) => {
+  return (
+    <Data.Dashboard
+      className={className}
+      summary={summary}
+      sliceName={sliceName}
+      queryMap={queryMap}
+      columns={["total<%= Model %>"]}
+      hidePresents={hidePresents}
+    />
+  );
+};
+
+export const Insight = ({
+  className,
+  insight,
+  sliceName = "<%= model %>",
+}: ModelInsightProps<cnst.<%= Model %>Insight>) => {
+  return (
+    <Data.Insight
+      className={className}
+      insight={insight}
+      sliceName={sliceName}
+      columns={["count"]}
+    />
+  );
+};

package/assets/assets/module/__Model__.View.tsx.template

@@ -0,0 +1,17 @@
+import { clsx } from "@akanjs/client";
+import { cnst } from "<%= clientPath %>";
+import { Image } from "@util/ui";
+
+interface <%= Model %>ViewProps {
+  className?: string;
+  <%= model %>: cnst.<%= Model %>;
+  self?: { id?: string } | null;
+}
+
+export const General = ({ className, <%= model %>, self }: <%= Model %>ViewProps) => {
+  return (
+    <div className={clsx(className, `animate-fadeIn w-full`)}>
+      <div>{<%= model %>.id}</div>
+    </div>
+  );
+};

package/assets/assets/module/__Model__.Zone.tsx.template

@@ -0,0 +1,52 @@
+"use client";
+import { Data, Load } from "@shared/ui";
+import { ModelsProps } from "@akanjs/client";
+import { cnst, <%= Model %> } from "<%= clientPath %>";
+import { ClientInit, ClientView, DefaultOf } from "@akanjs/signal";
+
+export const Admin = ({ sliceName = "<%= model %>", init, query }: ModelsProps<cnst.<%= Model %>>) => {
+  return (
+    <Data.ListContainer
+      init={init}
+      query={query}
+      sliceName={sliceName}
+      renderItem={<%= Model %>.Unit.Card}
+      renderDashboard={<%= Model %>.Util.Stat}
+      renderInsight={<%= Model %>.Util.Insight}
+      renderTemplate={<%= Model %>.Template.General}
+      renderTitle={(<%= model %>: DefaultOf<cnst.<%= Model %>>) => `<%= Model %> - ${<%= model %>.id ? <%= model %>.id : "New"}`}
+      renderView={(<%= model %>: cnst.<%= Model %>) => <<%= Model %>.View.General <%= model %>={<%= model %>} />}
+      columns={[
+        "id",
+        "status",
+        "createdAt",
+        "updatedAt",
+      ]}
+      actions={(<%= model %>: cnst.Light<%= Model %>, idx) => ["remove", "edit", "view"]}
+    />
+  );
+};
+
+interface CardProps {
+  className?: string;
+  init: ClientInit<"<%= model %>", cnst.Light<%= Model %>>;
+}
+export const Card = ({ className, init }: CardProps) => {
+  return (
+    <Load.Units
+      className={className}
+      init={init}
+      renderItem={(<%= model %>: cnst.Light<%= Model %>) => (
+        <<%= Model %>.Unit.Card key={<%= model %>.id} href={`/<%= model %>/${<%= model %>.id}`} <%= model %>={<%= model %>} />
+      )}
+    />
+  );
+};
+
+interface ViewProps {
+  className?: string;
+  view: ClientView<"<%= model %>", cnst.<%= Model %>>;
+}
+export const View = ({ view }: ViewProps) => {
+  return <Load.View view={view} renderView={(<%= model %>) => <<%= Model %>.View.General <%= model %>={<%= model %>} />} />;
+};

package/assets/assets/module/__model__.constant.ts.template

@@ -0,0 +1,44 @@
+import { enumOf, Int } from "@akanjs/base";
+import { Field, Filter, Model, sortOf, via } from "@akanjs/constant";
+
+export const <%= Model %>Status = enumOf(["active"] as const);
+export type <%= Model %>Status = enumOf<typeof <%= Model %>Status>;
+
+export const <%= Model %>Target = enumOf(["_blank", "_self"] as const);
+export type <%= Model %>Target = enumOf<typeof <%= Model %>Target>;
+
+@Model.Input("<%= Model %>Input")
+export class <%= Model %>Input {
+  @Field.Prop(() => String, { nullable: true })
+  field: string | null;
+}
+
+@Model.Object("<%= Model %>Object")
+export class <%= Model %>Object extends via(<%= Model %>Input) {
+  @Field.Prop(() => String, { enum: <%= Model %>Status, default: "active" })
+  status: <%= Model %>Status;
+}
+
+@Model.Light("Light<%= Model %>")
+export class Light<%= Model %> extends via(<%= Model %>Object, [
+  "field",
+  "status",
+] as const) {}
+
+@Model.Full("<%= Model %>")
+export class <%= Model %> extends via(<%= Model %>Object, Light<%= Model %>) {}
+
+@Model.Insight("<%= Model %>Insight")
+export class <%= Model %>Insight {
+  @Field.Prop(() => Int, { default: 0, accumulate: { $sum: 1 } })
+  count: number;
+}
+
+@Model.Summary("<%= Model %>Summary")
+export class <%= Model %>Summary {
+  @Field.Prop(() => Int, { min: 0, default: 0, query: {} })
+  total<%= Model %>: number;
+}
+
+@Model.Filter("<%= Model %>Filter")
+export class <%= Model %>Filter extends sortOf(<%= Model %>, {}) {}