@spaceinvoices/react-ui 0.1.1 → 0.4.0

package/src/components/entities/fina-settings-form/sections/register-premise-dialog.tsx

@@ -0,0 +1,395 @@
+import { zodResolver } from "@hookform/resolvers/zod";
+import type { FC } from "react";
+import type { Resolver } from "react-hook-form";
+import { useForm } from "react-hook-form";
+import { z } from "zod";
+import { Button } from "@/ui/components/ui/button";
+import {
+  Dialog,
+  DialogContent,
+  DialogDescription,
+  DialogFooter,
+  DialogHeader,
+  DialogTitle,
+} from "@/ui/components/ui/dialog";
+import {
+  Form,
+  FormControl,
+  FormDescription,
+  FormField,
+  FormItem,
+  FormLabel,
+  FormMessage,
+} from "@/ui/components/ui/form";
+import { Input } from "@/ui/components/ui/input";
+import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/ui/components/ui/select";
+import { useRegisterFinaMovablePremise, useRegisterFinaRealEstatePremise } from "../fina-settings.hooks";
+
+// Manual Zod schemas (SDK not regenerated for FINA yet)
+const realEstatePremiseSchema = z.object({
+  premise_id: z.string().min(1, "Premise ID is required").max(20),
+  real_estate: z.object({
+    cadastral_municipality: z.string().min(1, "Cadastral municipality is required"),
+    land_registry_number: z.string().min(1, "Land registry number is required"),
+    building_number: z.string().optional().default(""),
+    sub_building_number: z.string().optional().default(""),
+    street: z.string().optional().default(""),
+    house_number: z.string().optional().default(""),
+    house_number_additional: z.string().optional().default(""),
+    settlement: z.string().optional().default(""),
+    city: z.string().optional().default(""),
+    postal_code: z.string().optional().default(""),
+  }),
+});
+
+const movablePremiseSchema = z.object({
+  premise_id: z.string().min(1, "Premise ID is required").max(20),
+  movable_premise: z.object({
+    type: z.enum(["vehicle", "market_stall", "other"]),
+  }),
+});
+
+type RealEstatePremiseForm = z.infer<typeof realEstatePremiseSchema>;
+type MovablePremiseForm = z.infer<typeof movablePremiseSchema>;
+
+interface RegisterFinaPremiseDialogProps {
+  open: boolean;
+  onOpenChange: (open: boolean) => void;
+  entity: any;
+  type: "real-estate" | "movable";
+  t: (key: string) => string;
+  onSuccess?: () => void;
+  onError?: (error: unknown) => void;
+}
+
+export const RegisterFinaPremiseDialog: FC<RegisterFinaPremiseDialogProps> = ({
+  open,
+  onOpenChange,
+  entity,
+  type,
+  t,
+  onSuccess,
+  onError,
+}) => {
+  const isRealEstate = type === "real-estate";
+
+  const realEstateForm = useForm<RealEstatePremiseForm>({
+    resolver: zodResolver(realEstatePremiseSchema) as Resolver<RealEstatePremiseForm>,
+    defaultValues: {
+      premise_id: "",
+      real_estate: {
+        cadastral_municipality: "",
+        land_registry_number: "",
+        building_number: "",
+        sub_building_number: "",
+        street: "",
+        house_number: "",
+        house_number_additional: "",
+        settlement: "",
+        city: "",
+        postal_code: "",
+      },
+    },
+  });
+
+  const movableForm = useForm<MovablePremiseForm>({
+    resolver: zodResolver(movablePremiseSchema),
+    defaultValues: {
+      premise_id: "",
+      movable_premise: {
+        type: "vehicle",
+      },
+    },
+  });
+
+  const { mutate: registerRealEstate, isPending: isRealEstatePending } = useRegisterFinaRealEstatePremise({
+    onSuccess: () => {
+      realEstateForm.reset();
+      onSuccess?.();
+    },
+    onError,
+  });
+
+  const { mutate: registerMovable, isPending: isMovablePending } = useRegisterFinaMovablePremise({
+    onSuccess: () => {
+      movableForm.reset();
+      onSuccess?.();
+    },
+    onError,
+  });
+
+  const handleRealEstateSubmit = (data: RealEstatePremiseForm) => {
+    registerRealEstate({
+      entityId: entity.id,
+      data,
+    });
+  };
+
+  const handleMovableSubmit = (data: MovablePremiseForm) => {
+    registerMovable({
+      entityId: entity.id,
+      data,
+    });
+  };
+
+  const isPending = isRealEstatePending || isMovablePending;
+
+  return (
+    <Dialog open={open} onOpenChange={onOpenChange}>
+      <DialogContent className="max-h-[90vh] max-w-2xl overflow-y-auto">
+        <DialogHeader>
+          <DialogTitle>{isRealEstate ? t("Register Real Estate Premise") : t("Register Movable Premise")}</DialogTitle>
+          <DialogDescription>
+            {t(
+              "Register a new business premise with FINA. After registration, you'll need to add at least one electronic device.",
+            )}
+          </DialogDescription>
+        </DialogHeader>
+
+        {isRealEstate ? (
+          <Form {...realEstateForm}>
+            <form onSubmit={realEstateForm.handleSubmit(handleRealEstateSubmit as any)} className="space-y-4">
+              {/* Premise ID */}
+              <FormField
+                control={realEstateForm.control as any}
+                name="premise_id"
+                render={({ field }) => (
+                  <FormItem>
+                    <FormLabel>{t("Premise ID")}</FormLabel>
+                    <FormControl>
+                      <Input placeholder="PP1" {...field} />
+                    </FormControl>
+                    <FormDescription>{t("Unique identifier for this premise (e.g., PP1, OFFICE1)")}</FormDescription>
+                    <FormMessage />
+                  </FormItem>
+                )}
+              />
+
+              {/* Cadastral Municipality */}
+              <FormField
+                control={realEstateForm.control as any}
+                name="real_estate.cadastral_municipality"
+                render={({ field }) => (
+                  <FormItem>
+                    <FormLabel>{t("Cadastral Municipality")} *</FormLabel>
+                    <FormControl>
+                      <Input placeholder="12345" {...field} />
+                    </FormControl>
+                    <FormMessage />
+                  </FormItem>
+                )}
+              />
+
+              {/* Land Registry Number */}
+              <FormField
+                control={realEstateForm.control as any}
+                name="real_estate.land_registry_number"
+                render={({ field }) => (
+                  <FormItem>
+                    <FormLabel>{t("Land Registry Number")} *</FormLabel>
+                    <FormControl>
+                      <Input placeholder="123" {...field} />
+                    </FormControl>
+                    <FormMessage />
+                  </FormItem>
+                )}
+              />
+
+              {/* Building Information */}
+              <div className="grid grid-cols-2 gap-4">
+                <FormField
+                  control={realEstateForm.control as any}
+                  name="real_estate.building_number"
+                  render={({ field }) => (
+                    <FormItem>
+                      <FormLabel>{t("Building Number")}</FormLabel>
+                      <FormControl>
+                        <Input placeholder="1" {...field} value={field.value || ""} />
+                      </FormControl>
+                      <FormMessage />
+                    </FormItem>
+                  )}
+                />
+                <FormField
+                  control={realEstateForm.control as any}
+                  name="real_estate.sub_building_number"
+                  render={({ field }) => (
+                    <FormItem>
+                      <FormLabel>{t("Sub-Building Number")}</FormLabel>
+                      <FormControl>
+                        <Input placeholder="A" {...field} value={field.value || ""} />
+                      </FormControl>
+                      <FormMessage />
+                    </FormItem>
+                  )}
+                />
+              </div>
+
+              {/* Address */}
+              <FormField
+                control={realEstateForm.control as any}
+                name="real_estate.street"
+                render={({ field }) => (
+                  <FormItem>
+                    <FormLabel>{t("Street")}</FormLabel>
+                    <FormControl>
+                      <Input placeholder="Ilica" {...field} value={field.value || ""} />
+                    </FormControl>
+                    <FormMessage />
+                  </FormItem>
+                )}
+              />
+
+              <div className="grid grid-cols-2 gap-4">
+                <FormField
+                  control={realEstateForm.control as any}
+                  name="real_estate.house_number"
+                  render={({ field }) => (
+                    <FormItem>
+                      <FormLabel>{t("House Number")}</FormLabel>
+                      <FormControl>
+                        <Input placeholder="22" {...field} value={field.value || ""} />
+                      </FormControl>
+                      <FormMessage />
+                    </FormItem>
+                  )}
+                />
+                <FormField
+                  control={realEstateForm.control as any}
+                  name="real_estate.house_number_additional"
+                  render={({ field }) => (
+                    <FormItem>
+                      <FormLabel>{t("House Number Additional")}</FormLabel>
+                      <FormControl>
+                        <Input placeholder="A" {...field} value={field.value || ""} />
+                      </FormControl>
+                      <FormMessage />
+                    </FormItem>
+                  )}
+                />
+              </div>
+
+              <FormField
+                control={realEstateForm.control as any}
+                name="real_estate.settlement"
+                render={({ field }) => (
+                  <FormItem>
+                    <FormLabel>{t("Settlement")}</FormLabel>
+                    <FormControl>
+                      <Input placeholder="" {...field} value={field.value || ""} />
+                    </FormControl>
+                    <FormMessage />
+                  </FormItem>
+                )}
+              />
+
+              <div className="grid grid-cols-2 gap-4">
+                <FormField
+                  control={realEstateForm.control as any}
+                  name="real_estate.city"
+                  render={({ field }) => (
+                    <FormItem>
+                      <FormLabel>{t("City")}</FormLabel>
+                      <FormControl>
+                        <Input placeholder="Zagreb" {...field} value={field.value || ""} />
+                      </FormControl>
+                      <FormMessage />
+                    </FormItem>
+                  )}
+                />
+                <FormField
+                  control={realEstateForm.control as any}
+                  name="real_estate.postal_code"
+                  render={({ field }) => (
+                    <FormItem>
+                      <FormLabel>{t("Postal Code")}</FormLabel>
+                      <FormControl>
+                        <Input placeholder="10000" {...field} value={field.value || ""} />
+                      </FormControl>
+                      <FormMessage />
+                    </FormItem>
+                  )}
+                />
+              </div>
+
+              <DialogFooter>
+                <Button
+                  type="button"
+                  variant="outline"
+                  onClick={() => onOpenChange(false)}
+                  disabled={isPending}
+                  className="cursor-pointer"
+                >
+                  {t("Cancel")}
+                </Button>
+                <Button type="submit" disabled={isPending} className="cursor-pointer">
+                  {isPending ? t("Registering...") : t("Register Premise")}
+                </Button>
+              </DialogFooter>
+            </form>
+          </Form>
+        ) : (
+          <Form {...movableForm}>
+            <form onSubmit={movableForm.handleSubmit(handleMovableSubmit)} className="space-y-4">
+              {/* Premise ID */}
+              <FormField
+                control={movableForm.control}
+                name="premise_id"
+                render={({ field }) => (
+                  <FormItem>
+                    <FormLabel>{t("Premise ID")}</FormLabel>
+                    <FormControl>
+                      <Input placeholder="PP1" {...field} />
+                    </FormControl>
+                    <FormDescription>{t("Unique identifier for this premise (e.g., PP1, OFFICE1)")}</FormDescription>
+                    <FormMessage />
+                  </FormItem>
+                )}
+              />
+
+              {/* Premise Type */}
+              <FormField
+                control={movableForm.control}
+                name="movable_premise.type"
+                render={({ field }) => (
+                  <FormItem>
+                    <FormLabel>{t("Premise Type")}</FormLabel>
+                    <Select onValueChange={field.onChange} value={field.value}>
+                      <FormControl>
+                        <SelectTrigger>
+                          <SelectValue placeholder="Select type" />
+                        </SelectTrigger>
+                      </FormControl>
+                      <SelectContent>
+                        <SelectItem value="vehicle">{t("Vehicle")}</SelectItem>
+                        <SelectItem value="market_stall">{t("Market Stall")}</SelectItem>
+                        <SelectItem value="other">{t("Other Movable")}</SelectItem>
+                      </SelectContent>
+                    </Select>
+                    <FormDescription>{t("Type of movable business premise")}</FormDescription>
+                    <FormMessage />
+                  </FormItem>
+                )}
+              />
+
+              <DialogFooter>
+                <Button
+                  type="button"
+                  variant="outline"
+                  onClick={() => onOpenChange(false)}
+                  disabled={isPending}
+                  className="cursor-pointer"
+                >
+                  {t("Cancel")}
+                </Button>
+                <Button type="submit" disabled={isPending} className="cursor-pointer">
+                  {isPending ? t("Registering...") : t("Register Premise")}
+                </Button>
+              </DialogFooter>
+            </form>
+          </Form>
+        )}
+      </DialogContent>
+    </Dialog>
+  );
+};

package/src/components/entities/furs-settings-form/furs-settings-form.tsx

@@ -18,13 +18,20 @@ import { useFursPremises, useFursSettings, useUpdateFursSettings } from "./furs-
 // Import locale files
 import de from "./locales/de";
 import en from "./locales/en";
+import es from "./locales/es";
+import fr from "./locales/fr";
+import hr from "./locales/hr";
+import it from "./locales/it";
+import nl from "./locales/nl";
+import pl from "./locales/pl";
+import pt from "./locales/pt";
 import sl from "./locales/sl";
 import { CertificateSettingsSection } from "./sections/certificate-settings-section";
 import { EnableFiscalizationSection } from "./sections/enable-fiscalization-section";
 import { GeneralSettingsSection } from "./sections/general-settings-section";
 import { PremisesManagementSection } from "./sections/premises-management-section";
 
-const translations = { de, sl, en } as const;
+const translations = { sl, de, en, it, fr, es, pt, nl, pl, hr } as const;
 
 /**
  * FURS Settings Form Schema
@@ -38,6 +45,7 @@ export type FursSettingsFormSchema = z.infer<typeof fursSettingsFormSchema>;
 
 export type StepType = "settings" | "certificate" | "premises" | "enable";
 export type SectionType =
+  | "entity-info"
   | "operator"
   | "fiscalization"
   | "advanced"
@@ -147,19 +155,20 @@ export const FursSettingsForm: FC<FursSettingsFormProps> = ({
 
   // Step unlocking logic (new flow: settings -> certificate -> premises -> enable)
   // - Step 1 (Settings): Always accessible
-  // - Step 2 (Certificate): Always accessible
+  // - Step 2 (Certificate): Requires entity tax number
   // - Step 3 (Premises): Requires valid certificate
   // - Step 4 (Enable): Requires certificate + premise + device
+  const hasEntityTaxNumber = !!entity.tax_number;
   const fursEnabled = fursSettings?.enabled || false;
-  const canAccessCertificate = true; // Always accessible
-  const canAccessPremises = hasCertificate && certificateValid;
-  const canAccessEnable = certificateValid && hasPremises && hasPremiseWithDevice;
+  const canAccessCertificate = hasEntityTaxNumber;
+  const canAccessPremises = hasEntityTaxNumber && hasCertificate && certificateValid;
+  const canAccessEnable = hasEntityTaxNumber && certificateValid && hasPremises && hasPremiseWithDevice;
 
   const steps = [
     {
       id: "settings" as const,
       title: translate("General Settings"),
-      complete: true, // Settings are always "complete" - just configuration
+      complete: hasEntityTaxNumber,
       unlocked: true,
     },
     {
@@ -245,7 +254,7 @@ export const FursSettingsForm: FC<FursSettingsFormProps> = ({
   };
 
   if (settingsLoading || premisesLoading) {
-    return <PageLoadingSpinner text={translate("Loading...")} />;
+    return <PageLoadingSpinner />;
   }
 
   // Check if entity is in sandbox (test) mode
@@ -265,8 +274,14 @@ export const FursSettingsForm: FC<FursSettingsFormProps> = ({
             let tooltipText = "";
 
             if (isLocked) {
-              if (step.id === "premises") {
-                tooltipText = translate("Upload and validate digital certificate first");
+              if (step.id === "certificate") {
+                tooltipText = translate("Set entity tax number in General Settings first");
+              } else if (step.id === "premises") {
+                if (!hasEntityTaxNumber) {
+                  tooltipText = translate("Set entity tax number in General Settings first");
+                } else {
+                  tooltipText = translate("Upload and validate digital certificate first");
+                }
               } else if (step.id === "enable") {
                 if (!certificateValid) {
                   tooltipText = translate("Upload and validate digital certificate first");

package/src/components/entities/furs-settings-form/furs-settings.hooks.ts

@@ -5,12 +5,12 @@
 
 import type {
   FursBusinessPremise,
-  GetFursCertificate200,
   GetFursSettings200,
   RegisterFursMovablePremiseBody,
   RegisterFursRealEstatePremiseBody,
   UpdateFursSettingsBody,
   UpdateUserFursSettingsBody,
+  UploadFursCertificate200,
   User,
 } from "@spaceinvoices/js-sdk";
 import {
@@ -48,7 +48,7 @@ export function useFursSettings(
     queryFn: async () => {
       if (!sdk) throw new Error("SDK not initialized");
       if (!entityId) throw new Error("Entity ID required");
-      return (sdk.fursSettings as any).get({ entity_id: entityId });
+      return sdk.fursSettings.list({ entity_id: entityId });
     },
     enabled: !!sdk && !!entityId,
     staleTime: 0, // Always fetch fresh data
@@ -69,7 +69,7 @@ export function useUpdateFursSettings(
     ...options,
     mutationFn: async ({ entityId, data }) => {
       if (!sdk) throw new Error("SDK not initialized");
-      return (sdk.fursSettings as any).update(data, { entity_id: entityId });
+      return sdk.fursSettings.update(data, { entity_id: entityId });
     },
     onSuccess: (data, variables, context) => {
       // Invalidate settings query
@@ -88,7 +88,7 @@ export function useUpdateFursSettings(
  * Hook: Upload FURS certificate
  */
 export function useUploadFursCertificate(
-  options?: UseMutationOptions<GetFursCertificate200, Error, { entityId: string; file: Blob; passphrase: string }>,
+  options?: UseMutationOptions<UploadFursCertificate200, Error, { entityId: string; file: Blob; passphrase: string }>,
 ) {
   const { sdk } = useSDK();
   const queryClient = useQueryClient();
@@ -97,7 +97,7 @@ export function useUploadFursCertificate(
     ...options,
     mutationFn: async ({ entityId, file, passphrase }) => {
       if (!sdk) throw new Error("SDK not initialized");
-      return (sdk.fursSettings as any).uploadCertificate(file, passphrase, { entity_id: entityId });
+      return sdk.fursCertificate.uploadFursCertificate({ file, passphrase }, { entity_id: entityId });
     },
     onSuccess: (data, variables, context) => {
       // Invalidate settings query to refresh certificate status
@@ -125,7 +125,7 @@ export function useFursPremises(
     queryKey: fursQueryKeys.premises(entityId),
     queryFn: async () => {
       if (!sdk) throw new Error("SDK not initialized");
-      return (sdk.fursFiscalization as any).listPremises({ entity_id: entityId });
+      return sdk.fursFiscalization.listFursBusinessPremises({ entity_id: entityId });
     },
     enabled: !!sdk,
     staleTime: 0, // Always fetch fresh data to reflect device changes
@@ -146,7 +146,7 @@ export function useRegisterRealEstatePremise(
     ...options,
     mutationFn: async ({ entityId, data }) => {
       if (!sdk) throw new Error("SDK not initialized");
-      return (sdk.fursFiscalization as any).registerRealEstatePremise(data, { entity_id: entityId });
+      return sdk.fursFiscalization.registerFursRealEstatePremise(data, { entity_id: entityId });
     },
     onSuccess: (data, variables, context) => {
       // Invalidate premises list
@@ -174,7 +174,7 @@ export function useRegisterMovablePremise(
     ...options,
     mutationFn: async ({ entityId, data }) => {
       if (!sdk) throw new Error("SDK not initialized");
-      return (sdk.fursFiscalization as any).registerMovablePremise(data, { entity_id: entityId });
+      return sdk.fursFiscalization.registerFursMovablePremise(data, { entity_id: entityId });
     },
     onSuccess: (data, variables, context) => {
       // Invalidate premises list
@@ -200,7 +200,7 @@ export function useClosePremise(options?: UseMutationOptions<any, Error, { entit
     ...options,
     mutationFn: async ({ entityId, premiseId }) => {
       if (!sdk) throw new Error("SDK not initialized");
-      return (sdk.fursFiscalization as any).closePremise(premiseId, { entity_id: entityId });
+      return sdk.fursFiscalization.closeFursBusinessPremise(premiseId, { entity_id: entityId });
     },
     onSuccess: (data, variables, context) => {
       // Invalidate premises list
@@ -228,7 +228,11 @@ export function useRegisterElectronicDevice(
     ...options,
     mutationFn: async ({ entityId, premiseId, deviceName }) => {
       if (!sdk) throw new Error("SDK not initialized");
-      return (sdk.fursFiscalization as any).registerDevice(premiseId, { name: deviceName }, { entity_id: entityId });
+      return sdk.fursFiscalization.registerFursElectronicDevice(
+        premiseId,
+        { name: deviceName },
+        { entity_id: entityId },
+      );
     },
     onSuccess: (data, variables, context) => {
       // Invalidate premises list to refresh devices
@@ -304,7 +308,7 @@ export function useUpdateUserFursSettings(
     ...options,
     mutationFn: async ({ entityId, data }) => {
       if (!sdk) throw new Error("SDK not initialized");
-      return (sdk.users as any).updateFursSettings(data, { entity_id: entityId });
+      return sdk.users.updateFursSettings(data, { entity_id: entityId });
     },
     onSuccess: (data, variables, context) => {
       // Invalidate current user query to refresh settings