mobigrid-module 1.1.5 → 1.1.8

package/components/ui/select.tsx

@@ -1,157 +0,0 @@
-import * as React from "react"
-import * as SelectPrimitive from "@radix-ui/react-select"
-import { Check, ChevronDown, ChevronUp } from "lucide-react"
-
-import { cn } from "../../lib/utils"
-
-const Select = SelectPrimitive.Root
-
-const SelectGroup = SelectPrimitive.Group
-
-const SelectValue = SelectPrimitive.Value
-
-const SelectTrigger = React.forwardRef<
-  React.ElementRef<typeof SelectPrimitive.Trigger>,
-  React.ComponentPropsWithoutRef<typeof SelectPrimitive.Trigger>
->(({ className, children, ...props }, ref) => (
-  <SelectPrimitive.Trigger
-    ref={ref}
-    className={cn(
-      "flex h-9 w-full items-center justify-between whitespace-nowrap rounded-md border border-input bg-transparent px-3 py-2 text-sm shadow-sm ring-offset-background placeholder:text-muted-foreground focus:outline-none focus:ring-1 focus:ring-ring disabled:cursor-not-allowed disabled:opacity-50 [&>span]:line-clamp-1",
-      className
-    )}
-    {...props}
-  >
-    {children}
-    <SelectPrimitive.Icon asChild>
-      <ChevronDown className="h-4 w-4 opacity-50" />
-    </SelectPrimitive.Icon>
-  </SelectPrimitive.Trigger>
-))
-SelectTrigger.displayName = SelectPrimitive.Trigger.displayName
-
-const SelectScrollUpButton = React.forwardRef<
-  React.ElementRef<typeof SelectPrimitive.ScrollUpButton>,
-  React.ComponentPropsWithoutRef<typeof SelectPrimitive.ScrollUpButton>
->(({ className, ...props }, ref) => (
-  <SelectPrimitive.ScrollUpButton
-    ref={ref}
-    className={cn(
-      "flex cursor-default items-center justify-center py-1",
-      className
-    )}
-    {...props}
-  >
-    <ChevronUp className="h-4 w-4" />
-  </SelectPrimitive.ScrollUpButton>
-))
-SelectScrollUpButton.displayName = SelectPrimitive.ScrollUpButton.displayName
-
-const SelectScrollDownButton = React.forwardRef<
-  React.ElementRef<typeof SelectPrimitive.ScrollDownButton>,
-  React.ComponentPropsWithoutRef<typeof SelectPrimitive.ScrollDownButton>
->(({ className, ...props }, ref) => (
-  <SelectPrimitive.ScrollDownButton
-    ref={ref}
-    className={cn(
-      "flex cursor-default items-center justify-center py-1",
-      className
-    )}
-    {...props}
-  >
-    <ChevronDown className="h-4 w-4" />
-  </SelectPrimitive.ScrollDownButton>
-))
-SelectScrollDownButton.displayName =
-  SelectPrimitive.ScrollDownButton.displayName
-
-const SelectContent = React.forwardRef<
-  React.ElementRef<typeof SelectPrimitive.Content>,
-  React.ComponentPropsWithoutRef<typeof SelectPrimitive.Content>
->(({ className, children, position = "popper", ...props }, ref) => (
-  <SelectPrimitive.Portal>
-    <SelectPrimitive.Content
-      ref={ref}
-      className={cn(
-        "relative z-50 max-h-96 min-w-[8rem] overflow-hidden rounded-md border bg-popover text-popover-foreground shadow-md data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
-        position === "popper" &&
-          "data-[side=bottom]:translate-y-1 data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=top]:-translate-y-1",
-        className
-      )}
-      position={position}
-      {...props}
-    >
-      <SelectScrollUpButton />
-      <SelectPrimitive.Viewport
-        className={cn(
-          "p-1",
-          position === "popper" &&
-            "h-[var(--radix-select-trigger-height)] w-full min-w-[var(--radix-select-trigger-width)]"
-        )}
-      >
-        {children}
-      </SelectPrimitive.Viewport>
-      <SelectScrollDownButton />
-    </SelectPrimitive.Content>
-  </SelectPrimitive.Portal>
-))
-SelectContent.displayName = SelectPrimitive.Content.displayName
-
-const SelectLabel = React.forwardRef<
-  React.ElementRef<typeof SelectPrimitive.Label>,
-  React.ComponentPropsWithoutRef<typeof SelectPrimitive.Label>
->(({ className, ...props }, ref) => (
-  <SelectPrimitive.Label
-    ref={ref}
-    className={cn("px-2 py-1.5 text-sm font-semibold", className)}
-    {...props}
-  />
-))
-SelectLabel.displayName = SelectPrimitive.Label.displayName
-
-const SelectItem = React.forwardRef<
-  React.ElementRef<typeof SelectPrimitive.Item>,
-  React.ComponentPropsWithoutRef<typeof SelectPrimitive.Item>
->(({ className, children, ...props }, ref) => (
-  <SelectPrimitive.Item
-    ref={ref}
-    className={cn(
-      "relative flex w-full cursor-default select-none items-center rounded-sm py-1.5 pl-2 pr-8 text-sm outline-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
-      className
-    )}
-    {...props}
-  >
-    <span className="absolute right-2 flex h-3.5 w-3.5 items-center justify-center">
-      <SelectPrimitive.ItemIndicator>
-        <Check className="h-4 w-4" />
-      </SelectPrimitive.ItemIndicator>
-    </span>
-    <SelectPrimitive.ItemText>{children}</SelectPrimitive.ItemText>
-  </SelectPrimitive.Item>
-))
-SelectItem.displayName = SelectPrimitive.Item.displayName
-
-const SelectSeparator = React.forwardRef<
-  React.ElementRef<typeof SelectPrimitive.Separator>,
-  React.ComponentPropsWithoutRef<typeof SelectPrimitive.Separator>
->(({ className, ...props }, ref) => (
-  <SelectPrimitive.Separator
-    ref={ref}
-    className={cn("-mx-1 my-1 h-px bg-muted", className)}
-    {...props}
-  />
-))
-SelectSeparator.displayName = SelectPrimitive.Separator.displayName
-
-export {
-  Select,
-  SelectGroup,
-  SelectValue,
-  SelectTrigger,
-  SelectContent,
-  SelectLabel,
-  SelectItem,
-  SelectSeparator,
-  SelectScrollUpButton,
-  SelectScrollDownButton,
-}

package/components/ui/sonner.tsx

@@ -1,30 +0,0 @@
-import React from "react"
-import { useTheme } from "next-themes"
-import { Toaster as Sonner } from "sonner"
-
-type ToasterProps = React.ComponentProps<typeof Sonner>
-
-const Toaster = ({ ...props }: ToasterProps) => {
-  const { theme = "system" } = useTheme()
-
-  return (
-    <Sonner
-      theme={theme as ToasterProps["theme"]}
-      className="toaster group"
-      toastOptions={{
-        classNames: {
-          toast:
-            "group toast group-[.toaster]:bg-background group-[.toaster]:text-foreground group-[.toaster]:border-border group-[.toaster]:shadow-lg",
-          description: "group-[.toast]:text-muted-foreground",
-          actionButton:
-            "group-[.toast]:bg-primary group-[.toast]:text-primary-foreground",
-          cancelButton:
-            "group-[.toast]:bg-muted group-[.toast]:text-muted-foreground",
-        },
-      }}
-      {...props}
-    />
-  )
-}
-
-export { Toaster }

package/components/ui/table.tsx

@@ -1,120 +0,0 @@
-import * as React from "react"
-
-import { cn } from "../../lib/utils"
-
-const Table = React.forwardRef<
-  HTMLTableElement,
-  React.HTMLAttributes<HTMLTableElement>
->(({ className, ...props }, ref) => (
-  <div className="relative w-full overflow-auto">
-    <table
-      ref={ref}
-      className={cn("w-full caption-bottom text-sm", className)}
-      {...props}
-    />
-  </div>
-))
-Table.displayName = "Table"
-
-const TableHeader = React.forwardRef<
-  HTMLTableSectionElement,
-  React.HTMLAttributes<HTMLTableSectionElement>
->(({ className, ...props }, ref) => (
-  <thead ref={ref} className={cn("[&_tr]:border-b", className)} {...props} />
-))
-TableHeader.displayName = "TableHeader"
-
-const TableBody = React.forwardRef<
-  HTMLTableSectionElement,
-  React.HTMLAttributes<HTMLTableSectionElement>
->(({ className, ...props }, ref) => (
-  <tbody
-    ref={ref}
-    className={cn("[&_tr:last-child]:border-0", className)}
-    {...props}
-  />
-))
-TableBody.displayName = "TableBody"
-
-const TableFooter = React.forwardRef<
-  HTMLTableSectionElement,
-  React.HTMLAttributes<HTMLTableSectionElement>
->(({ className, ...props }, ref) => (
-  <tfoot
-    ref={ref}
-    className={cn(
-      "border-t bg-muted/50 font-medium [&>tr]:last:border-b-0",
-      className
-    )}
-    {...props}
-  />
-))
-TableFooter.displayName = "TableFooter"
-
-const TableRow = React.forwardRef<
-  HTMLTableRowElement,
-  React.HTMLAttributes<HTMLTableRowElement>
->(({ className, ...props }, ref) => (
-  <tr
-    ref={ref}
-    className={cn(
-      "border-b transition-colors hover:bg-muted/50 data-[state=selected]:bg-muted",
-      className
-    )}
-    {...props}
-  />
-))
-TableRow.displayName = "TableRow"
-
-const TableHead = React.forwardRef<
-  HTMLTableCellElement,
-  React.ThHTMLAttributes<HTMLTableCellElement>
->(({ className, ...props }, ref) => (
-  <th
-    ref={ref}
-    className={cn(
-      "h-10 px-2 text-left align-middle font-medium text-muted-foreground [&:has([role=checkbox])]:pr-0 [&>[role=checkbox]]:translate-y-[2px]",
-      className
-    )}
-    {...props}
-  />
-))
-TableHead.displayName = "TableHead"
-
-const TableCell = React.forwardRef<
-  HTMLTableCellElement,
-  React.TdHTMLAttributes<HTMLTableCellElement>
->(({ className, ...props }, ref) => (
-  <td
-    ref={ref}
-    className={cn(
-      "p-2 align-middle [&:has([role=checkbox])]:pr-0 [&>[role=checkbox]]:translate-y-[2px]",
-      className
-    )}
-    {...props}
-  />
-))
-TableCell.displayName = "TableCell"
-
-const TableCaption = React.forwardRef<
-  HTMLTableCaptionElement,
-  React.HTMLAttributes<HTMLTableCaptionElement>
->(({ className, ...props }, ref) => (
-  <caption
-    ref={ref}
-    className={cn("mt-4 text-sm text-muted-foreground", className)}
-    {...props}
-  />
-))
-TableCaption.displayName = "TableCaption"
-
-export {
-  Table,
-  TableHeader,
-  TableBody,
-  TableFooter,
-  TableHead,
-  TableRow,
-  TableCell,
-  TableCaption,
-}

package/index.d.ts

@@ -1,55 +0,0 @@
-declare module "mobigrid-module" {
-  import { ReactNode } from "react";
-
-  export interface FilterOption {
-    name: string;
-    type: string;
-    urlSource?: string;
-    options?: any[];
-    label?: string;
-    placeholder?: string;
-    required?: boolean;
-  }
-
-  export interface Column {
-    field: string;
-    headerName: string;
-    width?: number;
-    sortable?: boolean;
-    renderCell?: (params: any) => ReactNode;
-  }
-
-  export interface Config {
-    title: string;
-    data_url: string;
-    colomns: Column[];
-    Filters?: FilterOption[][];
-  }
-
-  export interface FilterState {
-    fromDate: string;
-    toDate: string;
-    [key: string]: any;
-  }
-
-  export interface ApiResponse {
-    DATA: any[];
-    PAGESNUM: number;
-  }
-
-  export interface Error {
-    title: string;
-    message: string;
-  }
-
-  export interface MobigridModuleProps {
-    configUrl: string;
-    preJsUrl: string;
-    itemsPerPage?: number;
-    children?: ReactNode;
-  }
-
-  const MobigridModule: React.FC<MobigridModuleProps>;
-
-  export default MobigridModule;
-} 

package/index.tsx

@@ -1,196 +0,0 @@
-import React from "react";
-import { useEffect, useState } from "react";
-import { format } from "date-fns";
-import axios from "axios";
-import { Alert, AlertTitle, AlertDescription } from "./components/ui/alert";
-import { AlertCircle } from "lucide-react";
-import { PageHeader } from "./components/Layout/PageHeader";
-import { CustomTable } from "./components/CustomTable/CustomTable";
-import Pagination from "./components/CustomTable/Pagination";
-import LoadingConfig from "./components/LoadingConfig";
-import InvalidConfig from "./components/InvalidConfig";
-
-const ITEMS_PER_PAGE = 14;
-
-interface ContainerProps {
-  configUrl: string;
-  preJsUrl: string;
-  itemsPerPage?: number;
-  children?: React.ReactNode;
-}
-
-const MobigridModule = ({
-  configUrl,
-  preJsUrl,
-  itemsPerPage = ITEMS_PER_PAGE,
-  children,
-}: ContainerProps) => {
-  const [config, setConfig] = useState<any>(null);
-  const [invalidConfig, setInvalidConfig] = useState(false);
-  const [errors, setErrors] = useState<
-    Array<{
-      title: string;
-      message: string;
-    }>
-  >([]);
-  const [isLoading, setIsLoading] = useState(false);
-  const [data, setData] = useState([]);
-  const [count, setCount] = useState(0);
-  const [currentPage, setCurrentPage] = useState(1);
-  const [totalPages, setTotalPages] = useState(1);
-  const [filters, setFilters] = useState({
-    fromDate: new Date(
-      new Date().getFullYear(),
-      new Date().getMonth(),
-      1
-    ).toLocaleString(),
-    toDate: new Date(
-      new Date().getFullYear(),
-      new Date().getMonth() + 1,
-      0,
-      23,
-      59,
-      59
-    ).toLocaleString(),
-  });
-  const [filterOptions, setFilterOptions] = useState<any[]>([]);
-
-  useEffect(() => {
-    const loadConfig = async () => {
-      try {
-        const response = await fetch(configUrl);
-        const data = await response.json();
-        if (data && data.title && data.data_url && data.colomns) {
-          setConfig(data);
-          setFilterOptions(data.Filters?.flat() || []);
-        } else {
-          setInvalidConfig(true);
-        }
-      } catch (error) {
-        setInvalidConfig(true);
-      }
-    };
-
-    const loadFunctions = async () => {
-      const response = await fetch(preJsUrl);
-      const script = document.createElement("script");
-      script.textContent = await response.text();
-      document.head.appendChild(script);
-    };
-
-    if (configUrl && preJsUrl) {
-      loadConfig();
-      loadFunctions();
-    }
-  }, [configUrl, preJsUrl]);
-
-  useEffect(() => {
-    const controller = new AbortController();
-
-    const initializeFilters = async () => {
-      const filters = config?.Filters?.flat() || [];
-      for (const filter of filters) {
-        if (filter.type === "Select" && filter.urlSource) {
-          await fetchFilterOptions(filter, controller.signal);
-        }
-      }
-    };
-
-    if (config) initializeFilters();
-
-    return () => controller.abort();
-  }, [config]);
-
-  const getData = async () => {
-    setErrors([]);
-    const postBody = {
-      page: currentPage,
-      filters: {
-        ...filters,
-        fromDate: format(filters.fromDate, "MM-dd-yyyy HH:mm"),
-        toDate: format(filters.toDate, "MM-dd-yyyy HH:mm"),
-      },
-    };
-
-    setIsLoading(true);
-    try {
-      const response = await axios.post(config.data_url, postBody);
-      setIsLoading(false);
-
-      if (response?.data) {
-        setData(response.data?.DATA);
-        setCount(response.data?.PAGESNUM);
-        setTotalPages(Math.ceil(response.data?.PAGESNUM / itemsPerPage) || 1);
-      } else {
-        setInvalidConfig(true);
-      }
-    } catch (error) {
-      setIsLoading(false);
-      setErrors((prev) => [
-        ...prev,
-        {
-          title: "Erreur",
-          message: "Une erreur est survenue",
-        },
-      ]);
-    }
-  };
-
-  const fetchFilterOptions = async (filter: any, signal?: AbortSignal) => {
-    if (filter.type === "Select" && filter.urlSource) {
-      try {
-        const response = await axios.get(filter.urlSource, { signal });
-        if (response?.status === 200 && response?.data) {
-          const options = Array.isArray(response.data) ? response.data : [];
-          setFilterOptions((prev) =>
-            prev.map((f) => (f.name === filter.name ? { ...f, options } : f))
-          );
-        }
-      } catch (error) {
-        if (!axios.isCancel(error)) {
-          setErrors((prev) => [
-            ...prev,
-            {
-              title: "Erreur",
-              message: `Une erreur est survenue lors de la récupération des options pour ${filter.name}`,
-            },
-          ]);
-          console.error(`Error fetching options for ${filter.name}:`, error);
-        }
-      }
-    }
-  };
-
-  if (invalidConfig) return <InvalidConfig />;
-  if (!config) return <LoadingConfig />;
-  return (
-    <div className="flex flex-col gap-4 p-4 max-w-[1300px] mx-auto mt-8 mb-">
-      <PageHeader
-        title={config.title}
-        configFilters={filterOptions}
-        filters={filters}
-        setFilters={setFilters}
-        onSearch={() => getData()}
-        count={count}
-        isLoading={isLoading}
-        setCurrentPage={setCurrentPage}
-      />
-      {errors.map((error, index) => (
-        <Alert key={index} variant="destructive">
-          <AlertCircle className="h-4 w-4" />
-          <AlertTitle>{error.title}</AlertTitle>
-          <AlertDescription>{error.message}</AlertDescription>
-        </Alert>
-      ))}
-      <CustomTable data={data} columns={config.colomns} isLoading={isLoading} />
-      <Pagination
-        currentPage={currentPage}
-        totalPages={totalPages}
-        onPageChange={setCurrentPage}
-      />
-      {children}
-    </div>
-  );
-};
-
-export { MobigridModule as default };

package/lib/utils.ts

@@ -1,6 +0,0 @@
-import { type ClassValue, clsx } from "clsx"
-import { twMerge } from "tailwind-merge"
-
-export function cn(...inputs: ClassValue[]) {
-  return twMerge(clsx(inputs))
-} 

package/tsconfig.json

@@ -1,36 +0,0 @@
-{
-    "compilerOptions": {
-        "target": "ES5",
-        "module": "ESNext",
-        "declaration": true,
-        "declarationDir": "dist/types",
-        "outDir": "dist",
-        "jsx": "react",
-        "strict": true,
-        "esModuleInterop": true,
-        "skipLibCheck": true,
-        "moduleResolution": "node",
-        "baseUrl": "./",
-        "paths": {
-            "*": [
-                "node_modules/*"
-            ]
-        },
-        "typeRoots": [
-            "./node_modules/@types",
-            "./typings"
-        ],
-    },
-    "include": [
-        "./**/*",
-        "typings",
-        "components",
-        "lib",
-        "types",
-        "index.tsx"
-    ],
-    "exclude": [
-        "node_modules",
-        "dist"
-    ]
-}