spoko-design-system 1.1.0 → 1.1.2

package/src/types/index.ts

@@ -1,237 +1,234 @@
-/// <reference types="vite/client" />
-
-export interface Breadcrumb {
-  name: string,
-  path: string
-}
-
-
-export interface Navigation {
-  currentIndex: number | null
-  prev: Product | null
-  next: Product | null
-}
-
-export interface ResponsiveImage {
-  media: string
-  src: string
-}
-
-export interface SubCategory {
-  id: number
-  name: string
-  parent_id: number
-  title?: string
-  desc?: string
-  slug: string
-  sort: number | null
-  description?: string
-  hasProducts: boolean
-  photo?: string | null
-  children?: SubCategory[]
-  seoTitle?: string
-}
-
-export interface Category {
-  id: number
-  parent_id: number | null
-  title?: string
-  slug: string
-  sort: number | null
-  description?: string
-  hasProducts: boolean
-  photo?: string | null
-  children: SubCategory[]
-  seoTitle?: string
-}
-
-export interface CatObject {
-  id: number
-  name: string
-  desc: string
-  parent_id: number | null
-  title?: string
-  slug: string
-  sort?: number | null
-  description?: string
-  hasProducts: boolean
-  photo?: string | null
-  children: SubCategory[]
-  seoTitle?: string
-}
-
-export interface CatLevels {
-  lvl1: Category|CatObject | null
-  lvl2: CatObject | null
-  lvl3: CatObject | null
-}
-export interface CatInfo {
-  category: CatObject | null
-  subcategory: CatObject | null
-  subsubcategory: CatObject | null
-}
-
-export interface Replacement {
-  date: string | null
-  info: string | null
-  number: string
-  prcodes: string[] | null
-  manufacturer: string | null
-}
-
-export interface Color {
-  id: Number
-  slug: String
-  name?: String
-}
-
-export interface DetailList {
-  name: string
-  id: string
-  value: string | number[] | Color[]
-  translated: boolean
-  icon: boolean | null
-  isArrayValue: boolean | null
-}
-
-export interface importantDetail {
-  name: string
-  id: string
-  value: string | number[]
-  translated: boolean
-  icon: boolean | null
-  isArrayValue: boolean | null
-}
-
-export interface Detail {
-  name: string
-  value: string | number[]
-  translated: boolean
-  icon: boolean | null
-  isArrayValue: boolean | null
-}
-
-export interface DetailObject {
-  importantDetails: importantDetail[]
-  list: DetailList[],
-  checklist: DetailList[]
-}
-
-
-export interface Image {
-  id: number
-  path: string
-}
-
-export interface ImageType {
-  id: number
-  path: string
-}
-
-export interface ImageApi {
-  id: number
-  slug: string
-  path: string
-}
-
-export interface ImageObject {
-  id: number
-  path: string
-}
-
-export interface ProductFile {
-  id: number
-  name: string
-  slug: string
-  path: string
-  type: number
-}
-
-export interface Product {
-  id: number
-  number: string
-  info: string | null
-  date: string | null
-  prcodes: string[] | null
-  engines: string[] | null
-  engine_type: EngineType[] | null
-  manufacturer: string[] | null
-  manufacturer_number: string | null
-  related: string[] | null
-  color_ids: string[] | null
-  position: string[] | null
-  model: string[] | null
-  replacement: Replacement[] | null
-  details: DetailList[] | null
-  photo: string
-  files: number[] | null
-  images: Image[] | null
-  category_id: number
-  hand_drive: number | null
-  materials: MaterialsObject[] | null
-  sort: number
-  created_at: string
-  updated_at: string
-}
-
-export interface MaterialsObject {
-  name: string,
-  list: Material[]
-}
-
-
-export interface Product2FullSearch {
-  number: string
-  category_id: number
-  photo: string
-  hand_drive: number | null
-  manufacturer: string[] | null
-  date: string | null
-  text: string
-  details: DetailList[] | null
-}
-
-export interface Link {
-  path: String
-  name: String
-}
-export interface EngineType {
-  id: Number
-  type: String
-}
-
-export interface Model {
-  id: Number
-  slug: String
-  sort: Number
-  name: String
-}
-
-export interface Material {
-  id: Number
-  name: String
-  slug: String
-  sort: Number | null
-  value?: String | null
-}
-
-export interface ProductImage {
-  title: string
-  alt: string
-  link: string
-  style?: string
-  __typename: string
-}
-
-export interface Position {
-  id: number
-  slug: string
-  sort: number
-  name: string
-}
-
-export interface Hreflang {
-  rel: 'alternate' | 'canonical'
-  href: string
-  hreflang: 'en' | 'pl' | 'x-default'
-}
+/// <reference types="vite/client" />
+
+export interface Breadcrumb {
+  name: string;
+  path: string;
+}
+
+export interface Navigation {
+  currentIndex: number | null;
+  prev: Product | null;
+  next: Product | null;
+}
+
+export interface ResponsiveImage {
+  media: string;
+  src: string;
+}
+
+export interface SubCategory {
+  id: number;
+  name: string;
+  parent_id: number;
+  title?: string;
+  desc?: string;
+  slug: string;
+  sort: number | null;
+  description?: string;
+  hasProducts: boolean;
+  photo?: string | null;
+  children?: SubCategory[];
+  seoTitle?: string;
+}
+
+export interface Category {
+  id: number;
+  parent_id: number | null;
+  title?: string;
+  slug: string;
+  sort: number | null;
+  description?: string;
+  hasProducts: boolean;
+  photo?: string | null;
+  children: SubCategory[];
+  seoTitle?: string;
+}
+
+export interface CatObject {
+  id: number;
+  name: string;
+  desc: string;
+  parent_id: number | null;
+  title?: string;
+  slug: string;
+  sort?: number | null;
+  description?: string;
+  hasProducts: boolean;
+  photo?: string | null;
+  children: SubCategory[];
+  seoTitle?: string;
+}
+
+export interface CatLevels {
+  lvl1: Category | CatObject | null;
+  lvl2: CatObject | null;
+  lvl3: CatObject | null;
+}
+export interface CatInfo {
+  category: CatObject | null;
+  subcategory: CatObject | null;
+  subsubcategory: CatObject | null;
+}
+
+export interface Replacement {
+  date: string | null;
+  info: string | null;
+  number: string;
+  prcodes: string[] | null;
+  manufacturer: string | null;
+}
+
+export interface Color {
+  id: Number;
+  slug: String;
+  name?: String;
+}
+
+export interface DetailList {
+  name: string;
+  id: string;
+  value: string | number[] | Color[];
+  translated: boolean;
+  icon: boolean | null;
+  isArrayValue: boolean | null;
+}
+
+export interface importantDetail {
+  name: string;
+  id: string;
+  value: string | number[];
+  translated: boolean;
+  icon: boolean | null;
+  isArrayValue: boolean | null;
+}
+
+export interface Detail {
+  name: string;
+  value: string | number[];
+  translated: boolean;
+  icon: boolean | null;
+  isArrayValue: boolean | null;
+}
+
+export interface DetailObject {
+  importantDetails: importantDetail[];
+  list: DetailList[];
+  checklist: DetailList[];
+}
+
+export interface Image {
+  id: number;
+  path: string;
+}
+
+export interface ImageType {
+  id: number;
+  path: string;
+}
+
+export interface ImageApi {
+  id: number;
+  slug: string;
+  path: string;
+}
+
+export interface ImageObject {
+  id: number;
+  path: string;
+}
+
+export interface ProductFile {
+  id: number;
+  name: string;
+  slug: string;
+  path: string;
+  type: number;
+}
+
+export interface Product {
+  id: number;
+  number: string;
+  info: string | null;
+  date: string | null;
+  prcodes: string[] | null;
+  engines: string[] | null;
+  engine_type: EngineType[] | null;
+  manufacturer: string[] | null;
+  manufacturer_number: string | null;
+  related: string[] | null;
+  color_ids: string[] | null;
+  position: string[] | null;
+  model: string[] | null;
+  replacement: Replacement[] | null;
+  details: DetailList[] | null;
+  photo: string;
+  files: number[] | null;
+  images: Image[] | null;
+  category_id: number;
+  hand_drive: number | null;
+  materials: MaterialsObject[] | null;
+  sort: number;
+  created_at: string;
+  updated_at: string;
+}
+
+export interface MaterialsObject {
+  name: string;
+  list: Material[];
+}
+
+export interface Product2FullSearch {
+  number: string;
+  category_id: number;
+  photo: string;
+  hand_drive: number | null;
+  manufacturer: string[] | null;
+  date: string | null;
+  text: string;
+  details: DetailList[] | null;
+}
+
+export interface Link {
+  path: String;
+  name: String;
+}
+export interface EngineType {
+  id: Number;
+  type: String;
+}
+
+export interface Model {
+  id: Number;
+  slug: String;
+  sort: Number;
+  name: String;
+}
+
+export interface Material {
+  id: Number;
+  name: String;
+  slug: String;
+  sort: Number | null;
+  value?: String | null;
+}
+
+export interface ProductImage {
+  title: string;
+  alt: string;
+  link: string;
+  style?: string;
+  __typename: string;
+}
+
+export interface Position {
+  id: number;
+  slug: string;
+  sort: number;
+  name: string;
+}
+
+export interface Hreflang {
+  rel: 'alternate' | 'canonical';
+  href: string;
+  hreflang: 'en' | 'pl' | 'x-default';
+}

package/src/utils/api/getCategories.ts

@@ -1,9 +1,9 @@
-import { getData } from "../getData"
-
-export const getApiCategories = getData('categories')
-
-// const getApiCategories = async () => {
-//     return await getData('categories');
-// }
-
-export default getApiCategories;
+import { getData } from '../getData';
+
+export const getApiCategories = getData('categories');
+
+// const getApiCategories = async () => {
+//     return await getData('categories');
+// }
+
+export default getApiCategories;

package/src/utils/category/getMainCategoryList.ts

@@ -1,22 +1,22 @@
-import type { CatObject  } from "@types/index";
-
-import { getApiCategories } from "@utils/api/getCategories";
-import { getSortedCategories } from "@utils/category/getSortedCategories";
-
-// Retrieve main categories:
-export const getMainCategoryList = async (locale: string = 'en'): Promise<CatObject[]> => {
-  // Fetch categories from API
-  const categories = await getApiCategories();
-
-  // Use category data directly (English only)
-  const processedCategories = categories.map((category) => {
-    return {
-      ...category,
-      name: category.name || category.slug,
-      desc: category.desc || ''
-    };
-  });
-
-  // Sort and return processed categories
-  return processedCategories.sort(getSortedCategories);
-};
+import type { CatObject } from '@types/index';
+
+import { getApiCategories } from '@utils/api/getCategories';
+import { getSortedCategories } from '@utils/category/getSortedCategories';
+
+// Retrieve main categories:
+export const getMainCategoryList = async (locale: string = 'en'): Promise<CatObject[]> => {
+  // Fetch categories from API
+  const categories = await getApiCategories();
+
+  // Use category data directly (English only)
+  const processedCategories = categories.map(category => {
+    return {
+      ...category,
+      name: category.name || category.slug,
+      desc: category.desc || '',
+    };
+  });
+
+  // Sort and return processed categories
+  return processedCategories.sort(getSortedCategories);
+};

package/src/utils/category/getSortedCategories.ts

@@ -1,11 +1,7 @@
-import type { CatObject, SubCategory } from "@types/index";
-
-
-// compareFn
-export const getSortedCategories = (a: CatObject|SubCategory, b: CatObject|SubCategory) => {
-  if (a.sort && b.sort)
-    return (a.sort - b.sort)
-
-  else
-    return 0
-}
+import type { CatObject, SubCategory } from '@types/index';
+
+// compareFn
+export const getSortedCategories = (a: CatObject | SubCategory, b: CatObject | SubCategory) => {
+  if (a.sort && b.sort) return a.sort - b.sort;
+  else return 0;
+};

package/src/utils/product/getPriceFormatted.ts

@@ -1,13 +1,16 @@
-export const getPriceFormatted  = (product: any) => {
-    // Default to EUR formatting for English-only design system
-    if (product.price_eur) {
-      return  new Intl.NumberFormat('de-DE', { style: 'currency', currency: 'EUR' }).format(product.price_eur)
-    }
-    if (product.price_pln) {
-      return  new Intl.NumberFormat('pl-PL', { style: 'currency', currency: 'PLN' }).format(product.price_pln)
-    }
-    return 'no price'
+export const getPriceFormatted = (product: any) => {
+  // Default to EUR formatting for English-only design system
+  if (product.price_eur) {
+    return new Intl.NumberFormat('de-DE', { style: 'currency', currency: 'EUR' }).format(
+      product.price_eur
+    );
   }
-  
+  if (product.price_pln) {
+    return new Intl.NumberFormat('pl-PL', { style: 'currency', currency: 'PLN' }).format(
+      product.price_pln
+    );
+  }
+  return 'no price';
+};
 
-  export default getPriceFormatted;
+export default getPriceFormatted;

package/src/utils/product/getProductChecklist.ts

@@ -1,16 +1,15 @@
+export const getProductCheckList = productDetails => {
+  if (!productDetails || !productDetails.length) {
+    return null;
+  }
 
-export const getProductCheckList = (productDetails) => {
-    if (!productDetails || !productDetails.length) {
-        return null;
-    }
+  const list = productDetails.filter(item => item.icon);
 
-    const list = productDetails.filter(item => item.icon);
+  if (!list.length) {
+    return null;
+  }
 
-    if (!list.length) {
-        return null;
-    }
-
-    return list.map(detail => detail.value || 'Detail');
-}
+  return list.map(detail => detail.value || 'Detail');
+};
 
 export default getProductCheckList;

package/src/utils/product/useFormatProductNumber.ts

@@ -11,32 +11,41 @@ interface FormattedNumbers {
   dash: string;
 }
 
-export default function useFormatProductNumber(productNumber: string | null): { formattedNumbers: FormattedNumbers | null } {
+export default function useFormatProductNumber(productNumber: string | null): {
+  formattedNumbers: FormattedNumbers | null;
+} {
   if (!productNumber) return { formattedNumbers: null };
 
   const formatProductNumber = (number: string, separator: string): string => {
     let formatted = number;
 
     if (isLetter(number[0]) && !isLetter(number[1]) && number.length === 9) {
-      formatted = formatted.replace(LIQUIDS_PATTERN, `$1${separator}$2${separator}$3${separator}$4`);
+      formatted = formatted.replace(
+        LIQUIDS_PATTERN,
+        `$1${separator}$2${separator}$3${separator}$4`
+      );
     } else if (number.length >= 13) {
-      formatted = formatted.replace(WHEELS_EMBLEMS_PATTERN, `$1${separator}$2${separator}$3${separator}$4${separator}$5`);
+      formatted = formatted.replace(
+        WHEELS_EMBLEMS_PATTERN,
+        `$1${separator}$2${separator}$3${separator}$4${separator}$5`
+      );
     } else if (number.length > 12) {
-      formatted = formatted.replace(ACCESSORIES_MATS_PATTERN, `$1${separator}$2${separator}$3${separator}$4${separator}$5`);
+      formatted = formatted.replace(
+        ACCESSORIES_MATS_PATTERN,
+        `$1${separator}$2${separator}$3${separator}$4${separator}$5`
+      );
     } else {
       formatted = formatted.replace(OTHER_PARTS_PATTERN, `$1${separator}`);
     }
 
-    return formatted
-      .replace(' ', separator)
-      .replace(/[^a-zA-Z0-9]$/, ''); // Remove the end trailing separator
+    return formatted.replace(' ', separator).replace(/[^a-zA-Z0-9]$/, ''); // Remove the end trailing separator
   };
 
   const formattedNumbers: FormattedNumbers = {
     standard: formatProductNumber(productNumber, '\u00A0'),
     dot: formatProductNumber(productNumber, '.'),
-    dash: formatProductNumber(productNumber, '-')
+    dash: formatProductNumber(productNumber, '-'),
   };
 
   return { formattedNumbers };
-}
+}