@deenruv/inpost-plugin 1.0.0

package/dist/plugin-server/ui/Inpost.tsx

@@ -0,0 +1,273 @@
+import React, { useCallback, useEffect, useState } from "react";
+import { DataService, I18nService } from "@deenruv/admin-ui/core";
+import {
+  ActionBar,
+  Card,
+  FormField,
+  useDetailComponentData,
+  useInjector,
+  useLazyQuery,
+} from "@deenruv/admin-ui/react";
+import { Client, Organization, Service } from "@deenruv/inpost";
+import gql from "graphql-tag";
+
+interface InpostConfig {
+  host: string;
+  apiKey?: string;
+  geowidgetKey?: string;
+  inpostOrganization?: number;
+  service?: Service;
+}
+
+export const Inpost: React.FC = () => {
+  const t = useInjector(I18nService);
+  const dataService = useInjector(DataService);
+  const [get, { data }] = useLazyQuery<{ getInpostConfig: InpostConfig }>(gql`
+    query InpostConfig {
+      getInpostConfig {
+        host
+        apiKey
+        geowidgetKey
+        inpostOrganization
+        service
+      }
+    }
+  `);
+  const { entity, detailForm } = useDetailComponentData();
+  const shippingMethodId = entity?.id as undefined | number;
+  const fulfillmentHandlerControl = detailForm.controls["fulfillmentHandler"];
+  const [handler, setHandler] = useState<string>(
+    fulfillmentHandlerControl.value || "",
+  );
+  const valueChangeCb = useCallback(
+    (value: string) => {
+      setHandler(value);
+    },
+    [setHandler],
+  );
+
+  const [inpostConfig, setInpostConfig] = useState<InpostConfig>({
+    host: "api-shipx-pl.easypack24.net",
+  });
+  const [organizations, setOrganizations] = useState([] as Organization[]);
+  const [modified, setModified] = useState(false);
+
+  useEffect(() => {
+    (async () => {
+      const config = await get();
+      setInpostConfig(config.getInpostConfig);
+      setModified(false);
+    })();
+  }, [get]);
+
+  useEffect(() => {
+    (async () => {
+      if (inpostConfig.apiKey && inpostConfig.host) {
+        const { host, apiKey } = inpostConfig;
+        const cli = new Client({ host, apiKey });
+        const organizations = await cli.organizations().list();
+        setOrganizations(organizations.items);
+        if (organizations.items[0]) {
+          const change: Pick<InpostConfig, "inpostOrganization" | "service"> = {
+            inpostOrganization: organizations.items[0].id,
+          };
+          if (organizations.items[0].services[0]) {
+            change.service = organizations.items[0].services[0];
+          }
+          setInpostConfig({ ...inpostConfig, ...change });
+        }
+      }
+    })();
+  }, [
+    inpostConfig.apiKey,
+    inpostConfig.host,
+    setOrganizations,
+    setInpostConfig,
+  ]);
+
+  useEffect(() => {
+    fulfillmentHandlerControl.valueChanges.subscribe(valueChangeCb);
+  }, [valueChangeCb, fulfillmentHandlerControl.valueChanges.subscribe]);
+
+  return shippingMethodId && handler === "inpost-fulfillment" ? (
+    <div style={{ marginBottom: "16px" }}>
+      <Card title={t.translate("inpost-plugin.title")}>
+        <div style={{ marginTop: "16px", marginBottom: "16px" }}>
+          <FormField
+            label={t.translate("inpost-plugin.connection-label")}
+            tooltip={t.translate("inpost-plugin.connection-tooltip")}
+            invalid={!data?.getInpostConfig}
+            errorMessage={
+              data?.getInpostConfig
+                ? ""
+                : t.translate("inpost-plugin.connection-error")
+            }
+          >
+            <span>
+              {data?.getInpostConfig
+                ? t.translate("inpost-plugin.connected")
+                : t.translate("inpost-plugin.not-connected")}
+            </span>
+          </FormField>
+        </div>
+        <div style={{ marginTop: "16px", marginBottom: "16px" }}>
+          <FormField
+            label={t.translate("inpost-plugin.host-label")}
+            tooltip={t.translate("inpost-plugin.host-tooltip")}
+            invalid={false}
+            errorMessage=""
+          >
+            <input
+              type="text"
+              value={inpostConfig.host}
+              onChange={(v) => {
+                setInpostConfig({ ...inpostConfig, host: v.target.value });
+                setModified(true);
+              }}
+            />
+          </FormField>
+        </div>
+        <div style={{ marginTop: "16px", marginBottom: "16px" }}>
+          <FormField
+            label={t.translate("inpost-plugin.api-key-label")}
+            tooltip={t.translate("inpost-plugin.api-key-tooltip")}
+            invalid={false}
+            errorMessage=""
+          >
+            <input
+              type="text"
+              value={inpostConfig.apiKey || ""}
+              onChange={(ev) => {
+                setInpostConfig({ ...inpostConfig, apiKey: ev.target.value });
+                setModified(true);
+              }}
+            />
+          </FormField>
+        </div>
+        <div style={{ marginTop: "16px", marginBottom: "16px" }}>
+          <FormField
+            label={t.translate("inpost-plugin.geowidget-key-label")}
+            tooltip={t.translate("inpost-plugin.geowidget-key-tooltip")}
+            invalid={false}
+            errorMessage=""
+          >
+            <input
+              type="text"
+              value={inpostConfig.geowidgetKey || ""}
+              onChange={(ev) => {
+                setInpostConfig({
+                  ...inpostConfig,
+                  geowidgetKey: ev.target.value,
+                });
+                setModified(true);
+              }}
+            />
+          </FormField>
+        </div>
+        <div style={{ marginTop: "16px", marginBottom: "16px" }}>
+          <FormField
+            label={t.translate("inpost-plugin.organization-select-label")}
+            tooltip={t.translate("inpost-plugin.organization-select-tooltip")}
+            invalid={false}
+            errorMessage=""
+          >
+            <select
+              disabled={!organizations.length}
+              defaultValue={`${inpostConfig.inpostOrganization ?? ""}`}
+              onBlur={(ev) => {
+                const org = organizations.find(
+                  (org) => `${org.id}` === ev.target.value,
+                );
+                setInpostConfig({
+                  ...inpostConfig,
+                  inpostOrganization: org && org.id,
+                });
+                setModified(true);
+              }}
+            >
+              {organizations.map((org) => (
+                <option value={`${org.id}`}>{org.name}</option>
+              ))}
+            </select>
+          </FormField>
+        </div>
+        <div style={{ marginTop: "16px", marginBottom: "16px" }}>
+          <FormField
+            label={t.translate("inpost-plugin.service-select-label")}
+            tooltip={t.translate("inpost-plugin.service-select-tooltip")}
+            invalid={false}
+            errorMessage=""
+          >
+            <select
+              disabled={typeof inpostConfig.inpostOrganization !== "number"}
+              defaultValue={`${inpostConfig.service ?? ""}`}
+              onBlur={(ev) => {
+                setInpostConfig({
+                  ...inpostConfig,
+                  service: ev.target.value as Service,
+                });
+                setModified(true);
+              }}
+            >
+              {organizations
+                .find(
+                  (org) =>
+                    typeof inpostConfig.inpostOrganization === "number" &&
+                    org.id === inpostConfig.inpostOrganization,
+                )
+                ?.services.map((svc) => (
+                  <option value={`${svc}`}>
+                    {t.translate(
+                      `inpost-plugin.service-${svc.replace(/_/gi, "-")}`,
+                    )}
+                  </option>
+                ))}
+            </select>
+          </FormField>
+        </div>
+        <div style={{ marginTop: "28px" }}>
+          <ActionBar>
+            <button
+              className="button primary"
+              onClick={() => {
+                dataService
+                  .mutate(
+                    gql`
+                      mutation SetInpostConfig(
+                        $shippingMethodId: ID!
+                        $host: String!
+                        $apiKey: String!
+                        $geowidgetKey: String
+                        $inpostOrganization: Int!
+                        $service: String!
+                      ) {
+                        setInpostShippingMethodConfig(
+                          input: {
+                            shippingMethodId: $shippingMethodId
+                            host: $host
+                            apiKey: $apiKey
+                            geowidgetKey: $geowidgetKey
+                            inpostOrganization: $inpostOrganization
+                            service: $service
+                          }
+                        )
+                      }
+                    `,
+                    {
+                      ...inpostConfig,
+                      shippingMethodId,
+                    },
+                  )
+                  .subscribe(() => {
+                    setModified(false);
+                  });
+              }}
+            >
+              {t.translate("inpost-plugin.save")}
+            </button>
+          </ActionBar>
+        </div>
+      </Card>
+    </div>
+  ) : null;
+};

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

@@ -0,0 +1,14 @@
+import { $ } from "../zeus";
+import { typedGql } from "../zeus/typedDocumentNode";
+import { scalars } from "./scalars";
+
+const mutation = typedGql("mutation", { scalars });
+
+const SEND_INVOICE = mutation({
+  sendInvoiceToWFirma: [
+    { input: $("input", "SendInvoiceToWFirmaInput!") },
+    { url: true },
+  ],
+});
+
+export const MUTATIONS = { SEND_INVOICE };

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

@@ -0,0 +1,7 @@
+import { typedGql } from "../zeus/typedDocumentNode";
+import { $ } from "../zeus";
+import { scalars } from "./scalars";
+
+const query = typedGql("query", { scalars });
+
+export const QUERIES = {};

package/dist/plugin-server/ui/graphql/scalars.ts

@@ -0,0 +1,15 @@
+import { ZeusScalars } from "../zeus";
+
+export const scalars = ZeusScalars({
+  DateTime: {
+    decode: (e: unknown) => new Date(e as string).toISOString(),
+    encode: (e: unknown) => (e as Date).toISOString(),
+  },
+  JSON: {
+    decode: (e: unknown) => JSON.parse(e as string),
+    encode: (e: unknown) => JSON.stringify(e),
+  },
+  Money: {
+    decode: (e) => e as number,
+  },
+});

package/dist/plugin-server/ui/providers.ts

@@ -0,0 +1,9 @@
+import { registerReactCustomDetailComponent } from "@deenruv/admin-ui/react";
+import { Inpost } from "./Inpost";
+
+export default [
+  registerReactCustomDetailComponent({
+    locationId: "shipping-method-detail",
+    component: Inpost,
+  }),
+];

package/dist/plugin-server/ui/routes.ts

@@ -0,0 +1 @@
+export default [];

package/dist/plugin-server/ui/translations/en.json

@@ -0,0 +1,31 @@
+{
+  "inpost-plugin": {
+    "title": "Configure InPost shipping method",
+    "host-label": "Host API ShipX",
+    "host-tooltip": "Host API ShipX that should be used to communicate with API",
+    "api-key-label": "ShipX API key",
+    "api-key-tooltip": "Private API key for ShipX API",
+    "organization-select-label": "Organization",
+    "organization-select-tooltip": "Select InPost organization",
+    "service-select-label": "Service",
+    "service-select-tooltip": "Select InPost service",
+    "service-inpost-locker-standard": "Parcel locker shipment - standard",
+    "service-inpost-locker-economy": "Parcel locker shipment - economy",
+    "service-inpost-locker-allegro": "Parcel locker shipment - Allegro Paczkomat® InPost.",
+    "service-inpost-locker-pass-thru": "Parcel locker shipment - Pass-Thru",
+    "service-inpost-letter-allegro": "Courier shipment - Allegro MiniKurier24 InPost",
+    "service-inpost-courier-allegro": "Courier shipment - Allegro Kurier24 InPost.",
+    "service-inpost-courier-c2c": "Courier shipment - InPost Courier C2C (service for a retail customer - prepaid)",
+    "service-inpost-courier-standard": "Courier shipment standard",
+    "service-inpost-courier-express-1000": "Courier shipment with delivery until 10:00",
+    "service-inpost-courier-express-1200": "Courier shipment with delivery until 12:00",
+    "service-inpost-courier-express-1700": "Courier shipment with delivery until 17:00",
+    "service-inpost-courier-palette": "Courier shipment Pallet Standard",
+    "save": "Zapisz",
+    "connection-label": "Connection",
+    "connection-tooltip": "Connection to InPost API",
+    "connected": "Connected",
+    "not-connected": "Not connected",
+    "connection-error": "Connection error"
+  }
+}

package/dist/plugin-server/ui/translations/pl.json

@@ -0,0 +1,33 @@
+{
+  "inpost-plugin": {
+    "title": "Skonfiguruj metodę wysyłki InPost",
+    "host-label": "Host API ShipX",
+    "host-tooltip": "Host API ShipX który powinien być użyty do komunikacji z API",
+    "api-key-label": "ShipX API klucz",
+    "api-key-tooltip": "Klucz prywatny do API ShipX",
+    "geowidget-key-label": "Klucz Geowidget",
+    "geowidget-key-tooltip": "Klucz publiczny do Geowidget",
+    "organization-select-label": "Organizacja",
+    "organization-select-tooltip": "Wybierz organizację w InPost",
+    "service-select-label": "Usługa",
+    "service-select-tooltip": "Wybierz usługę w InPost",
+    "service-inpost-locker-standard": "Przesyłka Paczkomat® - standardowa",
+    "service-inpost-locker-economy": "Przesyłka Paczkomat® - ekonomiczna",
+    "service-inpost-locker-allegro": "Przesyłka Paczkomat® - Allegro Paczkomat® InPost",
+    "service-inpost-locker-pass-thru": "Przesyłka Paczkomat® - Podaj Dalej",
+    "service-inpost-letter-allegro": "Przesyłka kurierska - Allegro MiniKurier24 InPost",
+    "service-inpost-courier-allegro": "Przesyłka kurierska - Allegro Kurier24 InPost",
+    "service-inpost-courier-c2c": "Przesyłka kurierska InPost Kurier C2C (usługa dla klienta detalicznego - prepaid)",
+    "service-inpost-courier-standard": "Przesyłka kurierska standardowa",
+    "service-inpost-courier-express-1000": "Przesyłka kurierska z doręczeniem do 10:00",
+    "service-inpost-courier-express-1200": "Przesyłka kurierska z doręczeniem do 12:00",
+    "service-inpost-courier-express-1700": "Przesyłka kurierska z doręczeniem do 17:00",
+    "service-inpost-courier-palette": "Przesyłka kurierska Paleta Standard",
+    "save": "Zapisz",
+    "connection-label": "Połączenie",
+    "connection-tooltip": "Połączenie z API InPost",
+    "connected": "Połączono",
+    "not-connected": "Nie połączono",
+    "connection-error": "Błąd połączenia"
+  }
+}