@deenruv/in-realization-plugin 1.0.0

package/dist/plugin-server/zeus/typedDocumentNode.d.ts

@@ -0,0 +1,3 @@
+import { TypedDocumentNode } from '@graphql-typed-document-node/core';
+import { ValueTypes, GenericOperation, OperationOptions, GraphQLTypes, InputType, ScalarDefinition, ThunderGraphQLOptions, ExtractVariables } from './';
+export declare const typedGql: <O extends "query" | "mutation", SCLR extends ScalarDefinition, R extends keyof ValueTypes = GenericOperation<O>>(operation: O, graphqlOptions?: ThunderGraphQLOptions<SCLR> | undefined) => <Z extends ValueTypes[R]>(o: Z & { [P in keyof Z]: P extends keyof ValueTypes[R] ? Z[P] : never; }, ops?: OperationOptions) => TypedDocumentNode<InputType<GraphQLTypes[R], Z, SCLR>, ExtractVariables<Z>>;

package/dist/plugin-server/zeus/typedDocumentNode.js

@@ -0,0 +1,16 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.typedGql = void 0;
+const graphql_tag_1 = __importDefault(require("graphql-tag"));
+const _1 = require("./");
+const typedGql = (operation, graphqlOptions) => (o, ops) => {
+    const str = (0, _1.Zeus)(operation, o, {
+        operationOptions: ops,
+        scalars: graphqlOptions === null || graphqlOptions === void 0 ? void 0 : graphqlOptions.scalars,
+    });
+    return (0, graphql_tag_1.default)(str);
+};
+exports.typedGql = typedGql;

package/dist/plugin-ui/components/InRealizationButton.d.ts

@@ -0,0 +1,2 @@
+import React from "react";
+export declare const InRealizationButton: () => React.JSX.Element | null;

package/dist/plugin-ui/components/InRealizationButton.js

@@ -0,0 +1,35 @@
+import { Button, useLazyQuery, useOrder } from "@deenruv/react-ui-devkit";
+import { NotepadText } from "lucide-react";
+import React, { useEffect, useMemo } from "react";
+import { useTranslation } from "react-i18next";
+import { translationNS } from "../translation-ns.js";
+import { GET_REALIZATION } from "../graphql/queries.js";
+export const InRealizationButton = () => {
+    const [getRealizationURL, { data }] = useLazyQuery(GET_REALIZATION);
+    const { t } = useTranslation(translationNS, {
+        i18n: window.__DEENRUV_SETTINGS__.i18n,
+    });
+    const { order, currentPossibilities, setManualChange } = useOrder();
+    const needRealization = useMemo(() => {
+        if (!currentPossibilities || !order)
+            return false;
+        if (currentPossibilities.to.includes("InRealization"))
+            return true;
+        return false;
+    }, [currentPossibilities, order]);
+    useEffect(() => {
+        if (!needRealization && order)
+            getRealizationURL({ orderID: order.id });
+    }, [needRealization, order]);
+    return needRealization ? (React.createElement(Button, { variant: "secondary", className: "flex gap-2", onClick: () => setManualChange({ state: true, toAction: "InRealization" }) },
+        React.createElement(NotepadText, { size: 20 }),
+        " ",
+        t("createRealization"))) : data?.getRealizationURL ? (React.createElement(Button, { variant: "outline", className: "flex gap-2", onClick: () => {
+            if (!data?.getRealizationURL)
+                return;
+            window.open(data.getRealizationURL, "_blank");
+        } },
+        React.createElement(NotepadText, { size: 20 }),
+        " ",
+        t("seeRealization"))) : null;
+};

package/dist/plugin-ui/components/InRealizationCard.d.ts

@@ -0,0 +1,2 @@
+import React from "react";
+export declare const InRealizationCard: () => React.JSX.Element;

package/dist/plugin-ui/components/InRealizationCard.js

@@ -0,0 +1,7 @@
+import { useOrder } from "@deenruv/react-ui-devkit";
+import React from "react";
+export const InRealizationCard = () => {
+    const { order } = useOrder();
+    console.log(order);
+    return React.createElement("div", null);
+};

package/dist/plugin-ui/components/InRealizationStateModal.d.ts

@@ -0,0 +1,5 @@
+import { ModalLocationsTypes } from "@deenruv/react-ui-devkit";
+import React from "react";
+export declare const InRealizationStateModal: ({ data: { state, order, beforeSubmit }, }: {
+    data: ModalLocationsTypes["manual-order-state"];
+}) => React.JSX.Element | null;

package/dist/plugin-ui/components/InRealizationStateModal.js

@@ -0,0 +1,124 @@
+import { Button, cn, Label, Popover, PopoverContent, PopoverTrigger, Select, SelectContent, SelectGroup, SelectItem, SelectTrigger, SelectValue, Calendar, Textarea, ImageWithPreview, AssetsModalInput, useMutation, } from "@deenruv/react-ui-devkit";
+import { CalendarIcon } from "lucide-react";
+import React, { useEffect, useState } from "react";
+import { useTranslation } from "react-i18next";
+import { toast } from "sonner";
+import { format } from "date-fns";
+import { DO_REALIZATION } from "../graphql/mutations.js";
+const REALIZATION_STATE = "InRealization";
+const COLORS = [
+    "BIAŁA",
+    "ŻÓŁTA",
+    "POMARAŃCZOWA",
+    "RÓŻOWA",
+    "ZIELONA",
+    "CZERWONA",
+];
+const DEADLINE_DAYS = 7;
+const DAY = 24 * 60 * 60 * 1000;
+export const InRealizationStateModal = ({ data: { state, order, beforeSubmit }, }) => {
+    const [mutate] = useMutation(DO_REALIZATION);
+    const { t } = useTranslation("orders");
+    const [form, setForm] = useState({
+        plannedDate: new Date(),
+        deadlineDate: new Date(new Date().getTime() + DEADLINE_DAYS * DAY),
+        color: COLORS[0],
+        note: "",
+        selectedAsset: order?.lines.map((line) => ({
+            id: line.productVariant.featuredAsset?.id ||
+                line.productVariant.product.featuredAsset?.id ||
+                "",
+            orderLineID: line.id,
+            preview: line.productVariant.featuredAsset?.preview ||
+                line.productVariant.product.featuredAsset?.preview ||
+                "",
+        })) || [],
+    });
+    const addRealization = async () => {
+        if (!order || !form.deadlineDate || !form.plannedDate)
+            return;
+        const { registerRealization } = await mutate({
+            input: {
+                orderID: order.id,
+                color: form.color,
+                finalPlannedAt: format(form.deadlineDate, "yyyy-MM-dd"),
+                plannedAt: format(form.plannedDate, "yyyy-MM-dd"),
+                assets: form.selectedAsset,
+                note: form.note,
+            },
+        });
+        if (!registerRealization?.url) {
+            toast.error("Error");
+            return;
+        }
+        window.open(registerRealization.url, "_blank");
+    };
+    useEffect(() => {
+        if (state !== REALIZATION_STATE)
+            return;
+        beforeSubmit.current = addRealization;
+        return () => {
+            beforeSubmit.current = undefined;
+        };
+    }, [state]);
+    if (state !== REALIZATION_STATE)
+        return null;
+    return (React.createElement("div", { className: "flex max-h-[60vh] w-auto  min-w-[60vw] max-w-[95vw] flex-col gap-2 overflow-y-auto pr-1" },
+        React.createElement("div", { className: "flex gap-4" },
+            React.createElement("div", { className: "flex w-[280px] flex-col gap-4" },
+                React.createElement("div", null,
+                    React.createElement(Label, null, t("changeStatus.planned")),
+                    React.createElement(Popover, null,
+                        React.createElement(PopoverTrigger, { asChild: true },
+                            React.createElement(Button, { variant: "outline", className: cn("w-[280px] justify-start text-left font-normal", !form.plannedDate && "text-muted-foreground") },
+                                React.createElement(CalendarIcon, { className: "mr-2 size-4" }),
+                                form.plannedDate ? (format(form.plannedDate, "PPP")) : (React.createElement("span", null, t("changeStatus.datePlaceholder"))))),
+                        React.createElement(PopoverContent, { className: "w-auto p-0" },
+                            React.createElement(Calendar, { mode: "single", selected: form.plannedDate, onSelect: (date) => setForm((prev) => ({ ...prev, plannedDate: date })) })))),
+                React.createElement("div", null,
+                    React.createElement(Label, null, t("changeStatus.deadline")),
+                    React.createElement(Popover, null,
+                        React.createElement(PopoverTrigger, { asChild: true },
+                            React.createElement(Button, { variant: "outline", className: cn("w-[280px] justify-start text-left font-normal", !form.plannedDate && "text-muted-foreground") },
+                                React.createElement(CalendarIcon, { className: "mr-2 size-4" }),
+                                form.deadlineDate ? (format(form.deadlineDate, "PPP")) : (React.createElement("span", null, t("changeStatus.datePlaceholder"))))),
+                        React.createElement(PopoverContent, { className: "w-auto p-0" },
+                            React.createElement(Calendar, { mode: "single", selected: form.deadlineDate, onSelect: (date) => setForm((prev) => ({ ...prev, deadlineDate: date })) })))),
+                React.createElement("div", null,
+                    React.createElement(Label, null, t("changeStatus.color")),
+                    React.createElement(Select, { name: "color", value: form.color, onValueChange: (e) => setForm((prev) => ({ ...prev, color: e })) },
+                        React.createElement(SelectTrigger, { className: " w-[280px] " },
+                            React.createElement(SelectValue, null)),
+                        React.createElement(SelectContent, null,
+                            React.createElement(SelectGroup, null, COLORS.map((c) => (React.createElement(SelectItem, { key: c, value: c }, c))))))),
+                React.createElement("div", null,
+                    React.createElement(Label, null, t("changeStatus.info")),
+                    React.createElement(Textarea, { className: "h-[60px] w-[280px]  resize-none", maxLength: 64, value: form.note, onChange: (e) => setForm((prev) => ({ ...prev, note: e.target.value })) }),
+                    React.createElement(Label, { className: "text-muted-foreground text-xs " }, t("changeStatus.charLeft", { value: 64 - form.note.length })))),
+            React.createElement("div", { className: "flex flex-1 flex-col gap-2" },
+                React.createElement(Label, null, t("changeStatus.selectImages")),
+                React.createElement("div", { className: "flex max-h-[calc(60vh-70px)] flex-1 flex-col gap-2 overflow-y-auto pr-2" }, order?.lines.map((line) => {
+                    const onAssetChange = (image) => {
+                        setForm((prev) => {
+                            const selectedAsset = prev.selectedAsset.map((asset) => {
+                                if (asset.orderLineID === line.id) {
+                                    return {
+                                        orderLineID: asset.orderLineID,
+                                        id: image?.id || "",
+                                        preview: image?.preview || "",
+                                    };
+                                }
+                                return asset;
+                            });
+                            return { ...prev, selectedAsset };
+                        });
+                    };
+                    return (React.createElement(Line, { key: line.id, line: line, asset: form.selectedAsset.find((a) => a.orderLineID === line.id), onAssetChange: onAssetChange }));
+                }))))));
+};
+const Line = ({ line, asset, onAssetChange }) => {
+    return (React.createElement("div", { key: line.id, className: "flex items-center gap-4" },
+        React.createElement(ImageWithPreview, { src: asset?.preview, imageClassName: "h-20 w-20 object-contain", alt: asset?.id || line.id }),
+        React.createElement("span", { className: "flex-1" }, line.productVariant?.name || line.productVariant?.product?.name),
+        React.createElement(AssetsModalInput, { value: asset, setValue: onAssetChange })));
+};

package/dist/plugin-ui/graphql/index.d.ts

@@ -0,0 +1 @@
+export * from "./selectors";

package/dist/plugin-ui/graphql/index.js

@@ -0,0 +1 @@
+export * from "./selectors";

package/dist/plugin-ui/graphql/mutations.d.ts

@@ -0,0 +1,18 @@
+export declare const DO_REALIZATION: import("@graphql-typed-document-node/core").TypedDocumentNode<{
+    registerRealization?: {
+        url?: string | null | undefined;
+    } | undefined;
+}, {} & {
+    input: {
+        orderID: string | import("../zeus/index.js").Variable<any, string>;
+        assets: import("../zeus/index.js").Variable<any, string> | {
+            id: string | import("../zeus/index.js").Variable<any, string>;
+            orderLineID: string | import("../zeus/index.js").Variable<any, string>;
+            preview: string | import("../zeus/index.js").Variable<any, string>;
+        }[];
+        plannedAt: string | import("../zeus/index.js").Variable<any, string>;
+        finalPlannedAt: string | import("../zeus/index.js").Variable<any, string>;
+        note: string | import("../zeus/index.js").Variable<any, string>;
+        color: string | import("../zeus/index.js").Variable<any, string>;
+    };
+}>;

package/dist/plugin-ui/graphql/mutations.js

@@ -0,0 +1,9 @@
+import { scalars } from "@deenruv/admin-types";
+import { typedGql } from "../zeus/typedDocumentNode.js";
+import { $ } from "../zeus/index.js";
+export const DO_REALIZATION = typedGql("mutation", { scalars })({
+    registerRealization: [
+        { input: $("input", "OrderRealizationInput!") },
+        { url: true },
+    ],
+});

package/dist/plugin-ui/graphql/queries.d.ts

@@ -0,0 +1,5 @@
+export declare const GET_REALIZATION: import("@graphql-typed-document-node/core").TypedDocumentNode<{
+    getRealizationURL?: string | null | undefined;
+}, {} & {
+    orderID: {};
+}>;

package/dist/plugin-ui/graphql/queries.js

@@ -0,0 +1,6 @@
+import { scalars } from "@deenruv/admin-types";
+import { typedGql } from "../zeus/typedDocumentNode.js";
+import { $ } from "../zeus/index.js";
+export const GET_REALIZATION = typedGql("query", { scalars })({
+    getRealizationURL: [{ orderID: $("orderID", "ID!") }, true],
+});

package/dist/plugin-ui/graphql/selectors.d.ts

@@ -0,0 +1,39 @@
+import { FromSelector } from "../zeus";
+declare const FacetValueOptionsSelector: {
+    id: true;
+    name: true;
+    code: true;
+    customFields: {
+        hexColor: true;
+        image: {
+            preview: true;
+        };
+        isNew: true;
+    };
+};
+export declare const FacetListOptionsSelector: {
+    items: {
+        id: true;
+        code: true;
+        name: true;
+        customFields: {
+            colorsCollection: true;
+            usedForProductCreations: boolean;
+        };
+        values: {
+            id: true;
+            name: true;
+            code: true;
+            customFields: {
+                hexColor: true;
+                image: {
+                    preview: true;
+                };
+                isNew: true;
+            };
+        };
+    };
+};
+export type FacetValueOptionsType = FromSelector<typeof FacetValueOptionsSelector, "FacetValue">;
+export type FacetListOptionsType = FromSelector<typeof FacetListOptionsSelector, "FacetList">;
+export {};

package/dist/plugin-ui/graphql/selectors.js

@@ -0,0 +1,25 @@
+import { Selector } from "../zeus";
+const FacetValueOptionsSelector = Selector("FacetValue")({
+    id: true,
+    name: true,
+    code: true,
+    customFields: {
+        hexColor: true,
+        image: {
+            preview: true,
+        },
+        isNew: true,
+    },
+});
+export const FacetListOptionsSelector = Selector("FacetList")({
+    items: {
+        id: true,
+        code: true,
+        name: true,
+        customFields: {
+            colorsCollection: true,
+            usedForProductCreations: true,
+        },
+        values: FacetValueOptionsSelector,
+    },
+});

package/dist/plugin-ui/index.d.ts

@@ -0,0 +1 @@
+export declare const InRealizationUIPlugin: import("@deenruv/react-ui-devkit").DeenruvUIPlugin<Record<string, any>>;

package/dist/plugin-ui/index.js

@@ -0,0 +1,17 @@
+import { createDeenruvUIPlugin } from "@deenruv/react-ui-devkit";
+import pl from "./locales/pl";
+import en from "./locales/en";
+import { translationNS } from "./translation-ns";
+import { InRealizationStateModal } from "./components/InRealizationStateModal.js";
+import { InRealizationCard } from "./components/InRealizationCard.js";
+import { InRealizationButton } from "./components/InRealizationButton.js";
+export const InRealizationUIPlugin = createDeenruvUIPlugin({
+    version: "1.0.0",
+    name: "In Realization Plugin",
+    translations: { ns: translationNS, data: { en, pl } },
+    actions: {
+        inline: [{ id: "orders-detail-view", component: InRealizationButton }],
+    },
+    components: [{ id: "orders-summary", component: InRealizationCard }],
+    modals: [{ id: "manual-order-state", component: InRealizationStateModal }],
+});

package/dist/plugin-ui/locales/en/index.d.ts

@@ -0,0 +1,5 @@
+declare const _default: {
+    createRealization: string;
+    seeRealization: string;
+}[];
+export default _default;

package/dist/plugin-ui/locales/en/index.js

@@ -0,0 +1,2 @@
+import realization from "./realization.json";
+export default [realization];

package/dist/plugin-ui/locales/en/realization.json

@@ -0,0 +1,4 @@
+{
+    "createRealization": "Create realization",
+    "seeRealization": "See realization"
+}

package/dist/plugin-ui/locales/pl/index.d.ts

@@ -0,0 +1,5 @@
+declare const _default: {
+    createRealization: string;
+    seeRealization: string;
+}[];
+export default _default;

package/dist/plugin-ui/locales/pl/index.js

@@ -0,0 +1,2 @@
+import realization from "./realization.json";
+export default [realization];

package/dist/plugin-ui/locales/pl/realization.json

@@ -0,0 +1,4 @@
+{
+    "createRealization": "Utwórz realizacje",
+    "seeRealization": "Zobacz realizacje"
+}

package/dist/plugin-ui/translation-ns.d.ts

@@ -0,0 +1 @@
+export declare const translationNS: string;

package/dist/plugin-ui/translation-ns.js

@@ -0,0 +1 @@
+export const translationNS = Symbol("in-realization-plugin").toString();

package/dist/plugin-ui/tsconfig.json

@@ -0,0 +1,18 @@
+{
+    "compilerOptions": {
+        "module": "ESNext",
+        "moduleResolution": "node",
+        "target": "ES2020",
+        "jsx": "react",
+        "outDir": "../../dist/plugin-ui",
+        "importHelpers": true,
+        "declaration": true,
+        "resolveJsonModule": true,
+        "skipLibCheck": true,
+        "strict": true,
+        "noImplicitAny": true,
+        "esModuleInterop": true,
+        "allowSyntheticDefaultImports": true
+    },
+    "include": ["./**/*.tsx", "./**/*.json", "./**/*.ts"]
+}

package/dist/plugin-ui/zeus/const.d.ts

@@ -0,0 +1,6 @@
+export declare const AllTypesProps: Record<string, any>;
+export declare const ReturnTypes: Record<string, any>;
+export declare const Ops: {
+    query: "Query";
+    mutation: "Mutation";
+};