@alphasquad/saleor-template-advance 0.1.0

package/src/hooks/useTokenExpiration.ts

@@ -0,0 +1,81 @@
+'use client';
+
+import { useEffect, useRef } from 'react';
+import { useGlobalStore } from '@/store/useGlobalStore';
+import { jwtDecode } from 'jwt-decode';
+
+type JwtPayload = { exp?: number };
+
+export function useTokenExpiration() {
+  const logout = useGlobalStore(s => s.logout);
+  const timeoutRef = useRef<number | null>(null);
+
+  useEffect(() => {
+    if (typeof window === 'undefined') return;
+
+    const SKEW = 30_000; // 30s early
+
+    const doClearAuth = async () => {
+      try {
+        // quick local cleanup to avoid UI flash
+        ['token','refreshToken','user','auth','session','apollo-cache-persist','wsm-global-store']
+          .forEach(k => { try { localStorage.removeItem(k); } catch {} });
+        await logout?.(); // store owns navigation
+      } catch {
+        window.location.replace('/');
+      }
+    };
+
+    const validateToken = (token: string): { isValid: boolean; expMs: number | null } => {
+      try {
+        const { exp } = jwtDecode<JwtPayload>(token);
+        const expMs = typeof exp === 'number' ? exp * 1000 : null;
+        const isValid = !!expMs && expMs > Date.now();
+        return { isValid, expMs };
+      } catch {
+        return { isValid: false, expMs: null };
+      }
+    };
+
+    const schedule = () => {
+      if (timeoutRef.current) { 
+        clearTimeout(timeoutRef.current); 
+        timeoutRef.current = null; 
+      }
+
+      const token = localStorage.getItem('token');
+      if (!token) return;
+
+      const { isValid, expMs } = validateToken(token);
+      
+      // If token is invalid or expired, clear auth immediately
+      if (!isValid) {
+        void doClearAuth();
+        return;
+      }
+
+      // If token is valid, schedule the next check
+      if (expMs) {
+        const delay = Math.max(expMs - Date.now() - SKEW, 0);
+        if (delay > 0) {
+          timeoutRef.current = window.setTimeout(() => { void doClearAuth(); }, delay);
+        } else {
+          void doClearAuth();
+        }
+      }
+    };
+
+    const onFocus = () => schedule();
+    const onVisibility = () => { if (document.visibilityState === 'visible') schedule(); };
+
+    schedule();
+    window.addEventListener('focus', onFocus);
+    window.addEventListener('visibilitychange', onVisibility);
+
+    return () => {
+      if (timeoutRef.current) clearTimeout(timeoutRef.current);
+      window.removeEventListener('focus', onFocus);
+      window.removeEventListener('visibilitychange', onVisibility);
+    };
+  }, [logout]);
+}

package/src/hooks/useVehicleData.ts

@@ -0,0 +1,346 @@
+import { shopApi } from "@/lib/api/shop";
+import { useEffect, useState, useRef } from "react";
+
+export interface VehicleOption {
+  id: string | number;
+  name: string;
+  value: string;
+}
+
+export interface FitmentAPIType {
+  id: number;
+  value: string;
+  name?: string;
+}
+
+export interface FitmentAPIMakesType {
+  id: number;
+  name: string;
+  children?: FitmentAPIMakesType[];
+}
+
+interface DropdownLevel {
+  typeId: number;
+  typeName: string;
+  values: FitmentAPIType[];
+  selectedValue: string;
+  selectedValueId: number;
+}
+
+export const useVehicleData = () => {
+  const [rootTypes, setRootTypes] = useState<FitmentAPIMakesType[]>([]);
+  const [selectedRootType, setSelectedRootType] = useState<number>(0);
+  const [dropdownLevels, setDropdownLevels] = useState<DropdownLevel[]>([]);
+  const [loading, setLoading] = useState(false);
+  const [hierarchyStructure, setHierarchyStructure] = useState<
+    FitmentAPIMakesType[]
+  >([]);
+  const isInitializingRef = useRef(false);
+  const hasInitializedRef = useRef(false);
+
+  const findDeepestPath = (
+    nodes: FitmentAPIMakesType[]
+  ): FitmentAPIMakesType[] => {
+    let deepestPath: FitmentAPIMakesType[] = [];
+    let maxDepth = 0;
+
+    const traverse = (
+      node: FitmentAPIMakesType,
+      currentPath: FitmentAPIMakesType[],
+      depth: number
+    ) => {
+      const newPath = [...currentPath, { id: node.id, name: node.name }];
+
+      if (!node.children || node.children.length === 0) {
+        if (depth > maxDepth) {
+          maxDepth = depth;
+          deepestPath = newPath;
+        }
+      } else {
+        node.children.forEach((child) => {
+          traverse(child, newPath, depth + 1);
+        });
+      }
+    };
+
+    nodes.forEach((node) => {
+      traverse(node, [], 1);
+    });
+
+    return deepestPath;
+  };
+
+  const flattenHierarchy = (
+    node: FitmentAPIMakesType,
+    result: FitmentAPIMakesType[] = []
+  ): FitmentAPIMakesType[] => {
+    result.push({ id: node.id, name: node.name });
+    if (node.children && node.children.length > 0) {
+      flattenHierarchy(node.children[0], result);
+    }
+    return result;
+  };
+
+  useEffect(() => {
+    const fetchRootTypes = async () => {
+      try {
+        const response = await shopApi.getRootTypes();
+        if (response?.data && response.data.length > 0) {
+          setRootTypes(response.data);
+
+          const typesWithChildren = response.data.filter(
+            (type: FitmentAPIMakesType) =>
+              type.children && type.children.length > 0
+          );
+
+          if (typesWithChildren.length > 0) {
+            const deepestPath = findDeepestPath(typesWithChildren);
+
+            if (deepestPath.length > 0) {
+              setHierarchyStructure(deepestPath);
+            }
+          }
+        }
+      } catch (error) {
+        console.error("Failed to fetch root types:", error);
+      }
+    };
+    fetchRootTypes();
+  }, []);
+
+  const getSelectedPairs = (): string => {
+    return dropdownLevels
+      .filter((level) => level.selectedValueId !== 0)
+      .map((level) => `${level.typeId}:${level.selectedValueId}`)
+      .join(",");
+  };
+
+  const getSelectedNames = (): string[] => {
+    return dropdownLevels
+      .filter((level) => level.selectedValueId !== 0)
+      .map((level) => level.selectedValue);
+  };
+
+  const fetchValues = async (
+    typeId: number,
+    selectedPairs?: string
+  ): Promise<FitmentAPIType[]> => {
+    try {
+      const query: number | string = selectedPairs
+        ? `${typeId}?selected_pairs=${selectedPairs}`
+        : typeId;
+
+      const response = await shopApi.getFitmentValuesApi(query);
+
+      if (response?.data) {
+        return Array.isArray(response.data) ? response.data : [response.data];
+      }
+      return [];
+    } catch (error) {
+      console.error("Failed to fetch values:", error);
+      return [];
+    }
+  };
+
+  const handleRootTypeChange = async (typeId: number) => {
+    if (hierarchyStructure.length === 0) return;
+
+    setSelectedRootType(typeId);
+    setLoading(true);
+
+    const levels: DropdownLevel[] = [];
+
+    const firstLevel = hierarchyStructure[0];
+    const values = await fetchValues(firstLevel.id);
+
+    levels.push({
+      typeId: firstLevel.id,
+      typeName: firstLevel.name,
+      values,
+      selectedValue: "",
+      selectedValueId: 0,
+    });
+
+    for (let i = 1; i < hierarchyStructure.length; i++) {
+      levels.push({
+        typeId: hierarchyStructure[i].id,
+        typeName: hierarchyStructure[i].name,
+        values: [],
+        selectedValue: "",
+        selectedValueId: 0,
+      });
+    }
+
+    setDropdownLevels(levels);
+    setLoading(false);
+  };
+
+  const handleValueChange = async (
+    levelIndex: number,
+    valueId: number,
+    value: string
+  ) => {
+    setLoading(true);
+
+    const updatedLevels = [...dropdownLevels];
+    updatedLevels[levelIndex] = {
+      ...updatedLevels[levelIndex],
+      selectedValue: value,
+      selectedValueId: valueId,
+    };
+
+    for (let i = levelIndex + 1; i < updatedLevels.length; i++) {
+      updatedLevels[i] = {
+        ...updatedLevels[i],
+        values: [],
+        selectedValue: "",
+        selectedValueId: 0,
+      };
+    }
+
+    const currentPairs = updatedLevels
+      .slice(0, levelIndex + 1)
+      .filter((level) => level.selectedValueId !== 0)
+      .map((level) => `${level.typeId}:${level.selectedValueId}`)
+      .join(",");
+
+    setDropdownLevels(updatedLevels);
+
+    const isLastLevel = levelIndex === hierarchyStructure.length - 1;
+
+    if (isLastLevel) {
+      setLoading(false);
+      return;
+    }
+
+    const nextLevelIndex = levelIndex + 1;
+    const nextLevel = hierarchyStructure[nextLevelIndex];
+    const nextValues = await fetchValues(nextLevel.id, currentPairs);
+
+    updatedLevels[nextLevelIndex] = {
+      ...updatedLevels[nextLevelIndex],
+      values: nextValues,
+    };
+
+    setDropdownLevels(updatedLevels);
+    setLoading(false);
+  };
+
+  const initializeFromPairs = async (pairs: string) => {
+    if (
+      !pairs ||
+      isInitializingRef.current ||
+      hasInitializedRef.current ||
+      hierarchyStructure.length === 0
+    ) {
+      return;
+    }
+
+    isInitializingRef.current = true;
+    setLoading(true);
+
+    try {
+      const parsed = pairs.split(",").map((pair) => {
+        const [typeId, valueId] = pair.split(":").map(Number);
+        return { typeId, valueId };
+      });
+
+      const levels: DropdownLevel[] = [];
+
+      for (let i = 0; i < hierarchyStructure.length; i++) {
+        const hierarchyLevel = hierarchyStructure[i];
+
+        const currentPairs = levels
+          .filter((l) => l.selectedValueId !== 0)
+          .map((level) => `${level.typeId}:${level.selectedValueId}`)
+          .join(",");
+
+        const values = await fetchValues(
+          hierarchyLevel.id,
+          currentPairs || undefined
+        );
+
+        const selectionForThisLevel = parsed.find(
+          (p) => p.typeId === hierarchyLevel.id
+        );
+
+        if (selectionForThisLevel) {
+          const selectedOption = values.find(
+            (v) => v.id === selectionForThisLevel.valueId
+          );
+
+          if (selectedOption) {
+            levels.push({
+              typeId: hierarchyLevel.id,
+              typeName: hierarchyLevel.name,
+              values,
+              selectedValue: selectedOption.value || selectedOption.name || "",
+              selectedValueId: selectionForThisLevel.valueId,
+            });
+          } else {
+            levels.push({
+              typeId: hierarchyLevel.id,
+              typeName: hierarchyLevel.name,
+              values,
+              selectedValue: "",
+              selectedValueId: 0,
+            });
+            break;
+          }
+        } else {
+          levels.push({
+            typeId: hierarchyLevel.id,
+            typeName: hierarchyLevel.name,
+            values: i === 0 ? values : [],
+            selectedValue: "",
+            selectedValueId: 0,
+          });
+
+          for (let j = i + 1; j < hierarchyStructure.length; j++) {
+            levels.push({
+              typeId: hierarchyStructure[j].id,
+              typeName: hierarchyStructure[j].name,
+              values: [],
+              selectedValue: "",
+              selectedValueId: 0,
+            });
+          }
+          break;
+        }
+      }
+
+      setSelectedRootType(hierarchyStructure[0].id);
+      setDropdownLevels(levels);
+      hasInitializedRef.current = true;
+    } catch (error) {
+      console.error("Failed to initialize from pairs:", error);
+    } finally {
+      setLoading(false);
+      isInitializingRef.current = false;
+    }
+  };
+
+  const resetInitialization = () => {
+    hasInitializedRef.current = false;
+    setDropdownLevels([]);
+    setSelectedRootType(0);
+  };
+
+  const isComplete =
+    dropdownLevels.length > 0 &&
+    dropdownLevels.every((level) => level.selectedValueId !== 0);
+
+  return {
+    rootTypes,
+    selectedRootType,
+    dropdownLevels,
+    loading,
+    handleRootTypeChange,
+    handleValueChange,
+    isComplete,
+    getSelectedPairs,
+    getSelectedNames,
+    initializeFromPairs,
+    resetInitialization,
+  };
+};

package/src/lib/api/kount.ts

@@ -0,0 +1,165 @@
+import { KountConfigResponse, KountFraudCheckRequest, KountFraudCheckResponse } from "@/graphql/types/checkout";
+
+export interface KountOrderUpdateRequest {
+  kountOrderId: string;
+  transactions: Array<{
+    transactionId: string;
+    paymentStatus: "AUTHORIZED" | "REFUSED";
+    authorizationStatus: {
+      authResult: "Approved" | "Declined";
+      verificationResponse: {
+        cvvStatus: "Match" | "Unknown";
+        avsStatus: string;
+      };
+    };
+    payment: {
+      type: string;
+      paymentToken: string;
+      bin: string;
+    };
+  }>;
+  [key: string]: unknown;
+}
+
+const KOUNT_BASE_URL = (process.env.NEXT_PUBLIC_KOUNT_BASE_URL || "").trim() || "https://kount.wsm-dev.com/api";
+
+/* ----------------- HTTP helpers ----------------- */
+async function httpGet<T>(path: string, headers?: Record<string, string>): Promise<T> {
+  const url = `${KOUNT_BASE_URL}${path}`;
+  
+  let res: Response;
+  try {
+    res = await fetch(url, {
+      method: "GET",
+      headers: {
+        "Content-Type": "application/json",
+        ...headers,
+      },
+      cache: "no-store", // Always fetch fresh config for security
+    });
+  } catch (e) {
+    throw new Error(
+      `GET ${url} network error: ${e instanceof Error ? e.message : String(e)}`
+    );
+  }
+
+  if (!res.ok) {
+    let msg = res.statusText;
+    try {
+      const j = (await res.json()) as { message?: string };
+      msg = j?.message || msg;
+    } catch {
+      /* ignore */
+    }
+    throw new Error(`GET ${url} failed: ${res.status} ${msg}`);
+  }
+  return res.json() as Promise<T>;
+}
+
+async function httpPost<T>(path: string, body: Record<string, unknown>, headers?: Record<string, string>): Promise<T> {
+  const url = `${KOUNT_BASE_URL}${path}`;
+  
+  let res: Response;
+  try {
+    res = await fetch(url, {
+      method: "POST",
+      headers: {
+        "Content-Type": "application/json",
+        ...headers,
+      },
+      body: JSON.stringify(body),
+      cache: "no-store",
+    });
+  } catch (e) {
+    throw new Error(
+      `POST ${url} network error: ${e instanceof Error ? e.message : String(e)}`
+    );
+  }
+
+  if (!res.ok) {
+    let msg = res.statusText;
+    try {
+      const j = (await res.json()) as { message?: string };
+      msg = j?.message || msg;
+    } catch {
+      /* ignore */
+    }
+    throw new Error(`POST ${url} failed: ${res.status} ${msg}`);
+  }
+  return res.json() as Promise<T>;
+}
+
+async function httpPatch<T>(path: string, body: Record<string, unknown>, headers?: Record<string, string>): Promise<T> {
+  const url = `${KOUNT_BASE_URL}${path}`;
+  
+  let res: Response;
+  try {
+    res = await fetch(url, {
+      method: "PATCH",
+      headers: {
+        "Content-Type": "application/json",
+        ...headers,
+      },
+      body: JSON.stringify(body),
+      cache: "no-store",
+    });
+  } catch (e) {
+    throw new Error(
+      `PATCH ${url} network error: ${e instanceof Error ? e.message : String(e)}`
+    );
+  }
+
+  if (!res.ok) {
+    let msg = res.statusText;
+    try {
+      const j = (await res.json()) as { message?: string };
+      msg = j?.message || msg;
+    } catch {
+      /* ignore */
+    }
+    throw new Error(`PATCH ${url} failed: ${res.status} ${msg}`);
+  }
+  return res.json() as Promise<T>;
+}
+
+/* ----------------- Public API ----------------- */
+export const kountApi = {
+  async getKountConfig(): Promise<KountConfigResponse> {
+    const saleorDomain = process.env.NEXT_PUBLIC_API_URL;
+    if (!saleorDomain) {
+      throw new Error("NEXT_PUBLIC_API_URL is not configured");
+    }
+
+    const headers = {
+      "Saleor-Domain": saleorDomain,
+    };
+
+    return httpGet<KountConfigResponse>("/get-kount-config", headers);
+  },
+
+  async performFraudCheck(request: KountFraudCheckRequest): Promise<KountFraudCheckResponse> {
+    const saleorDomain = process.env.NEXT_PUBLIC_API_URL;
+    if (!saleorDomain) {
+      throw new Error("NEXT_PUBLIC_API_URL is not configured");
+    }
+
+    const headers = {
+      "Saleor-Domain": saleorDomain,
+    };
+
+    return httpPost<KountFraudCheckResponse>("/kount-fraud-check", request, headers);
+  },
+
+  async updateKountOrder(updateRequest: KountOrderUpdateRequest): Promise<Record<string, unknown>> {
+    const saleorDomain = process.env.NEXT_PUBLIC_API_URL;
+    if (!saleorDomain) {
+      throw new Error("NEXT_PUBLIC_API_URL is not configured");
+    }
+
+    const headers = {
+      "Saleor-Domain": saleorDomain,
+    };
+
+    return httpPatch("/kount-order-update", updateRequest, headers);
+  },
+};