@deenruv/merchant-plugin 1.0.0

package/dist/plugin-ui/index.js

@@ -0,0 +1,40 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { createDeenruvUIPlugin } from "@deenruv/react-ui-devkit";
+import { GooglePage } from "./pages/GooglePage.js";
+import { FacebookPage } from "./pages/FacebookPage.js";
+import { GlobeIcon } from "lucide-react";
+import pl from "./locales/pl";
+import en from "./locales/en";
+import { translationNS } from "./translation-ns.js";
+export const MerchantPluginUI = createDeenruvUIPlugin({
+    version: "1.0.0",
+    name: "MerchantPluginUI",
+    translations: { ns: translationNS, data: { en, pl } },
+    pages: [
+        { path: "google-merchant", element: _jsx(GooglePage, {}) },
+        { path: "facebook-commerce", element: _jsx(FacebookPage, {}) },
+    ],
+    navMenuGroups: [
+        {
+            id: "merchant-platforms",
+            labelId: "nav.merchantPlatforms",
+            placement: { groupId: "settings" },
+        },
+    ],
+    navMenuLinks: [
+        {
+            groupId: "merchant-platforms",
+            id: "google-merchant",
+            labelId: "nav.googleMerchant",
+            href: "google-merchant",
+            icon: GlobeIcon,
+        },
+        {
+            groupId: "merchant-platforms",
+            id: "facebook-commerce",
+            labelId: "nav.facebookCommerce",
+            href: "facebook-commerce",
+            icon: GlobeIcon,
+        },
+    ],
+});

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

@@ -0,0 +1,8 @@
+declare const _default: {
+    nav: {
+        googleMerchant: string;
+        facebookCommerce: string;
+        merchantPlatforms: string;
+    };
+}[];
+export default _default;

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

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

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

@@ -0,0 +1,7 @@
+{
+    "nav": {
+        "googleMerchant": "Google Merchant",
+        "facebookCommerce": "Facebook Commerce",
+        "merchantPlatforms": "Merchant Platforms"
+    }
+}

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

@@ -0,0 +1,8 @@
+declare const _default: {
+    nav: {
+        googleMerchant: string;
+        facebookCommerce: string;
+        merchantPlatforms: string;
+    };
+}[];
+export default _default;

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

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

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

@@ -0,0 +1,7 @@
+{
+    "nav": {
+        "googleMerchant": "Google Merchant",
+        "facebookCommerce": "Facebook Commerce",
+        "merchantPlatforms": "Merchant Platforms"
+    }
+}

package/dist/plugin-ui/pages/FacebookPage.d.ts

@@ -0,0 +1 @@
+export declare const FacebookPage: () => import("react/jsx-runtime").JSX.Element;

package/dist/plugin-ui/pages/FacebookPage.js

@@ -0,0 +1,130 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect, useState } from "react";
+import { Label, Input, PageBlock, useLazyQuery, useMutation, Checkbox, Button, } from "@deenruv/react-ui-devkit";
+import { getMerchantPlatformInfo, getMerchantPlatformSettings, } from "../graphql/queries";
+import { saveMerchantPlatformSettings, removeOrphanItems, } from "../graphql/mutations";
+import { toast } from "sonner";
+export const FacebookPage = () => {
+    const [fetchMerchantPlatformSettings] = useLazyQuery(getMerchantPlatformSettings);
+    const [fetchMerchantPlatformInfo] = useLazyQuery(getMerchantPlatformInfo);
+    const [mutate] = useMutation(saveMerchantPlatformSettings);
+    const [removeOldItems] = useMutation(removeOrphanItems);
+    const [serviceInfo, setServiceInfo] = useState({
+        productsCount: 0,
+        connectionStatus: false,
+    });
+    const [isLoading, setIsLoading] = useState(true);
+    const [settingsForm, setSettingsForm] = useState({
+        brand: "",
+        merchantId: "",
+        credentials: "",
+        autoUpdate: true,
+        firstSync: true,
+    });
+    const refetch = async () => {
+        try {
+            setIsLoading(true);
+            const [settingsData, infoData] = await Promise.all([
+                fetchMerchantPlatformSettings({ platform: "facebook" }),
+                fetchMerchantPlatformInfo({ platform: "facebook" }),
+            ]);
+            const settings = settingsData?.getMerchantPlatformSettings?.entries?.reduce((acc, { key, value }) => {
+                if (key === "brand") {
+                    acc.brand = value;
+                }
+                if (key === "merchantId") {
+                    acc.merchantId = value;
+                }
+                if (key === "credentials") {
+                    acc.credentials = value;
+                }
+                if (key === "autoUpdate") {
+                    acc.autoUpdate = value === "true";
+                }
+                if (key === "firstSync") {
+                    acc.firstSync = value === "true";
+                }
+                return acc;
+            }, {});
+            setSettingsForm((prev) => ({ ...prev, ...settings }));
+            setServiceInfo({
+                productsCount: infoData?.getMerchantPlatformInfo?.[0]?.productsCount || 0,
+                connectionStatus: infoData?.getMerchantPlatformInfo?.[0]?.isValidConnection || false,
+            });
+            setIsLoading(false);
+        }
+        catch (error) {
+            console.error(error);
+            setIsLoading(false);
+        }
+    };
+    useEffect(() => {
+        refetch();
+    }, []);
+    const onSubmit = async (e) => {
+        e.preventDefault();
+        try {
+            const { saveMerchantPlatformSettings } = await mutate({
+                input: {
+                    platform: "facebook",
+                    entries: Object.entries(settingsForm).map(([key, value]) => ({
+                        key,
+                        value: value.toString(),
+                    })),
+                },
+            });
+            if (saveMerchantPlatformSettings) {
+                toast.success("Settings saved successfully");
+                refetch();
+            }
+            else {
+                toast.error("Failed to save settings");
+            }
+        }
+        catch (error) {
+            console.error(error);
+            toast.error("Failed to save settings");
+        }
+    };
+    return (_jsx(PageBlock, { children: _jsxs("div", { style: { position: "relative" }, className: "flex flex-col p-4 relative max-w-[800px] mx-auto", children: [isLoading && (_jsx("div", { style: {
+                        position: "absolute",
+                        top: 0,
+                        left: 0,
+                        width: "100%",
+                        height: "100%",
+                        backgroundColor: "rgba(0, 0, 0, 0.5)",
+                        zIndex: 10,
+                        display: "flex",
+                        justifyContent: "center",
+                        alignItems: "center",
+                        borderBottomRightRadius: "10px",
+                    }, children: _jsx("div", { style: {
+                            display: "flex",
+                            justifyContent: "center",
+                            alignItems: "center",
+                            width: "42px",
+                            height: "42px",
+                        }, className: "spinner" }) })), " ", _jsxs("form", { className: "flex flex-col gap-4", onSubmit: onSubmit, children: [_jsxs("div", { className: "flex justify-between gap-4", children: [_jsxs("div", { className: "w-full flex flex-col gap-2", children: [_jsx(Label, { children: "Brand" }), _jsx(Input, { className: "w-full", value: settingsForm.brand, onChange: (e) => setSettingsForm({ ...settingsForm, brand: e.target.value }) })] }), _jsxs("div", { className: "w-full flex flex-col gap-2", children: [_jsx(Label, { children: "Catalog ID" }), _jsx(Input, { className: "w-full", value: settingsForm.merchantId, onChange: (e) => setSettingsForm({
+                                                ...settingsForm,
+                                                merchantId: e.target.value,
+                                            }) })] })] }), _jsxs("div", { className: "flex flex-col gap-4", children: [_jsxs("div", { className: "flex flex-col", children: [_jsx(Label, { children: "Facebook Access Token" }), _jsx(Input, { className: "w-full", value: settingsForm.credentials, onChange: (e) => setSettingsForm({
+                                                ...settingsForm,
+                                                credentials: e.target.value,
+                                            }) })] }), _jsxs("div", { className: "flex gap-2 items-center", children: [_jsx(Checkbox, { id: "facebook-account-credentials", checked: settingsForm.autoUpdate, onCheckedChange: (checked) => setSettingsForm({
+                                                ...settingsForm,
+                                                autoUpdate: typeof checked === "boolean" ? checked : false,
+                                            }) }), _jsx(Label, { htmlFor: "facebook-account-credentials", children: "Auto update on Product's change" })] })] }), _jsx("div", { className: "flex justify-end", children: _jsxs("div", { className: "flex items-center gap-4", children: [_jsxs("div", { className: "flex gap-2", children: [_jsx(Label, { htmlFor: "auto-update-on-products-change", children: "Update ALL products with saving" }), _jsx(Checkbox, { id: "auto-update-on-products-change", checked: settingsForm.firstSync, onCheckedChange: (checked) => setSettingsForm({
+                                                    ...settingsForm,
+                                                    firstSync: typeof checked === "boolean" ? checked : false,
+                                                }) })] }), _jsx(Button, { children: "Save" })] }) })] }), _jsxs("div", { className: "flex gap-2", children: [_jsx("span", { children: "Connection status" }), serviceInfo.connectionStatus ? _jsx("div", { children: "\uD83D\uDC9A" }) : _jsx("div", { children: "\uD83D\uDC94" })] }), serviceInfo.connectionStatus ? (_jsx("div", { className: "mt-8", children: _jsx(Button, { onClick: async () => {
+                            try {
+                                await removeOldItems({ platform: "facebook" });
+                                toast.success("Old items removed successfully");
+                                refetch();
+                            }
+                            catch (error) {
+                                console.error(error);
+                                toast.error("Failed to remove old items");
+                            }
+                        }, children: "Remove old items" }) })) : null] }) }));
+};

package/dist/plugin-ui/pages/GooglePage.d.ts

@@ -0,0 +1 @@
+export declare const GooglePage: () => import("react/jsx-runtime").JSX.Element;

package/dist/plugin-ui/pages/GooglePage.js

@@ -0,0 +1,155 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect, useState } from "react";
+import { Label, Input, PageBlock, useLazyQuery, useMutation, Checkbox, Button, } from "@deenruv/react-ui-devkit";
+import { getMerchantPlatformInfo, getMerchantPlatformSettings, } from "../graphql/queries";
+import { removeOrphanItems, saveMerchantPlatformSettings, } from "../graphql/mutations";
+import { toast } from "sonner";
+export const GooglePage = () => {
+    const [fetchMerchantPlatformSettings] = useLazyQuery(getMerchantPlatformSettings);
+    const [fetchMerchantPlatformInfo] = useLazyQuery(getMerchantPlatformInfo);
+    const [mutate] = useMutation(saveMerchantPlatformSettings);
+    const [removeOldItems] = useMutation(removeOrphanItems);
+    const [serviceInfo, setServiceInfo] = useState({
+        productsCount: 0,
+        connectionStatus: false,
+    });
+    const handleSelectedFile = (e) => {
+        const file = e.target.files?.[0];
+        if (file) {
+            const reader = new FileReader();
+            reader.onload = () => {
+                const result = reader.result;
+                try {
+                    const jsonObject = JSON.parse(result);
+                    setSettingsForm({
+                        ...settingsForm,
+                        credentials: JSON.stringify(jsonObject),
+                    });
+                }
+                catch (error) {
+                    console.error("Invalid JSON file:", error);
+                }
+            };
+            reader.onerror = (e) => {
+                console.error("Error reading file", e);
+            };
+            if (file)
+                reader.readAsText(file);
+        }
+    };
+    const [isLoading, setIsLoading] = useState(true);
+    const [settingsForm, setSettingsForm] = useState({
+        brand: "",
+        merchantId: "",
+        credentials: "",
+        autoUpdate: true,
+        firstSync: true,
+    });
+    const refetch = async () => {
+        try {
+            setIsLoading(true);
+            const [settingsData, infoData] = await Promise.all([
+                fetchMerchantPlatformSettings({ platform: "google" }),
+                fetchMerchantPlatformInfo({ platform: "google" }),
+            ]);
+            const settings = settingsData?.getMerchantPlatformSettings?.entries?.reduce((acc, { key, value }) => {
+                if (key === "brand") {
+                    acc.brand = value;
+                }
+                if (key === "merchantId") {
+                    acc.merchantId = value;
+                }
+                if (key === "credentials") {
+                    acc.credentials = value;
+                }
+                if (key === "autoUpdate") {
+                    acc.autoUpdate = value === "true";
+                }
+                if (key === "firstSync") {
+                    acc.firstSync = value === "true";
+                }
+                return acc;
+            }, {});
+            setSettingsForm((prev) => ({ ...prev, ...settings }));
+            setServiceInfo({
+                productsCount: infoData?.getMerchantPlatformInfo?.[0]?.productsCount || 0,
+                connectionStatus: infoData?.getMerchantPlatformInfo?.[0]?.isValidConnection || false,
+            });
+            setIsLoading(false);
+        }
+        catch (error) {
+            console.error(error);
+            setIsLoading(false);
+        }
+    };
+    useEffect(() => {
+        refetch();
+    }, []);
+    const onSubmit = async (e) => {
+        e.preventDefault();
+        try {
+            const { saveMerchantPlatformSettings } = await mutate({
+                input: {
+                    platform: "google",
+                    entries: Object.entries(settingsForm).map(([key, value]) => ({
+                        key,
+                        value: value.toString(),
+                    })),
+                },
+            });
+            if (saveMerchantPlatformSettings) {
+                toast.success("Settings saved successfully");
+                refetch();
+            }
+            else {
+                toast.error("Failed to save settings");
+            }
+        }
+        catch (error) {
+            console.error(error);
+            toast.error("Failed to save settings");
+        }
+    };
+    return (_jsx(PageBlock, { children: _jsxs("div", { style: { position: "relative" }, className: "flex flex-col p-4 relative max-w-[800px] mx-auto", children: [isLoading && (_jsx("div", { style: {
+                        position: "absolute",
+                        top: 0,
+                        left: 0,
+                        width: "100%",
+                        height: "100%",
+                        backgroundColor: "rgba(0, 0, 0, 0.5)",
+                        zIndex: 10,
+                        display: "flex",
+                        justifyContent: "center",
+                        alignItems: "center",
+                        borderBottomRightRadius: "10px",
+                    }, children: _jsx("div", { style: {
+                            display: "flex",
+                            justifyContent: "center",
+                            alignItems: "center",
+                            width: "42px",
+                            height: "42px",
+                        }, className: "spinner" }) })), _jsxs("form", { className: "flex flex-col gap-4", onSubmit: onSubmit, children: [_jsxs("div", { className: "flex justify-between gap-4", children: [_jsxs("div", { className: "w-full flex flex-col gap-2", children: [_jsx(Label, { children: "Brand" }), _jsx(Input, { className: "w-full", value: settingsForm.brand, onChange: (e) => setSettingsForm({ ...settingsForm, brand: e.target.value }) })] }), _jsxs("div", { className: "w-full flex flex-col gap-2", children: [_jsx(Label, { children: "Merchant ID" }), _jsx(Input, { className: "w-full", value: settingsForm.merchantId, onChange: (e) => setSettingsForm({
+                                                ...settingsForm,
+                                                merchantId: e.target.value,
+                                            }) })] })] }), _jsxs("div", { className: "flex flex-col gap-4", children: [_jsxs("div", { className: "flex flex-col", children: [_jsx(Label, { children: "Google Account Credentials" }), _jsx(Input, { style: {
+                                                border: "none",
+                                                backgroundColor: "transparent",
+                                                background: "none",
+                                            }, type: "file", accept: ".json", onChange: handleSelectedFile })] }), _jsxs("div", { className: "flex gap-2 items-center", children: [_jsx(Checkbox, { id: "google-account-credentials", checked: settingsForm.autoUpdate, onCheckedChange: (checked) => setSettingsForm({
+                                                ...settingsForm,
+                                                autoUpdate: typeof checked === "boolean" ? checked : false,
+                                            }) }), _jsx(Label, { htmlFor: "google-account-credentials", children: "Auto update on Product's change" })] })] }), _jsx("div", { className: "flex justify-end", children: _jsxs("div", { className: "flex items-center gap-4", children: [_jsxs("div", { className: "flex gap-2", children: [_jsx(Label, { htmlFor: "auto-update-on-products-change", children: "Update ALL products with saving" }), _jsx(Checkbox, { id: "auto-update-on-products-change", checked: settingsForm.firstSync, onCheckedChange: (checked) => setSettingsForm({
+                                                    ...settingsForm,
+                                                    firstSync: typeof checked === "boolean" ? checked : false,
+                                                }) })] }), _jsx(Button, { children: "Save" })] }) })] }), _jsxs("div", { className: "flex gap-2", children: [_jsx("span", { children: "Connection status" }), serviceInfo.connectionStatus ? _jsx("div", { children: "\uD83D\uDC9A" }) : _jsx("div", { children: "\uD83D\uDC94" })] }), serviceInfo.connectionStatus ? (_jsx("div", { className: "mt-8", children: _jsx(Button, { onClick: async () => {
+                            try {
+                                await removeOldItems({ platform: "facebook" });
+                                toast.success("Old items removed successfully");
+                                refetch();
+                            }
+                            catch (error) {
+                                console.error(error);
+                                toast.error("Failed to remove old items");
+                            }
+                        }, children: "Remove old items" }) })) : null] }) }));
+};

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("merchant-plugin").toString();

package/dist/plugin-ui/tsconfig.json

@@ -0,0 +1,18 @@
+{
+    "compilerOptions": {
+        "jsx": "react-jsx",
+        "module": "ESNext",
+        "moduleResolution": "node",
+        "target": "ES2020",
+        "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";
+};