@star-insure/sdk 1.2.0 → 2.0.1

package/src/components/common/Button.tsx

@@ -1,60 +1,77 @@
-import React from "react";
-import { Link } from "@inertiajs/inertia-react";
+import React from 'react';
+import { Link } from '@inertiajs/react';
 
 interface Props {
-    className?: string;
-    href?: string;
-    target?: '_blank' | '_self';
-    onClick?: Function;
-    type?: 'button' | 'submit';
-    status?: 'primary' | 'danger' | 'warning' | 'info' | 'default';
-    children: React.ReactNode;
-    disabled?: boolean;
-    as?: 'link' | 'button' | 'a';
+  className?: string;
+  href?: string;
+  target?: '_blank' | '_self';
+  onClick?: Function;
+  type?: 'button' | 'submit';
+  status?: 'primary' | 'danger' | 'warning' | 'info' | 'default';
+  children: React.ReactNode;
+  disabled?: boolean;
+  as?: 'link' | 'button' | 'a';
 }
 
-export default function Button({ className, href, target, onClick, type, children, status = 'default', disabled = false, as }: Props) {
-    const baseClasses = 'font-black inline-flex items-center gap-3 justify-center text-white text-center px-5 py-2 rounded-md min-w-[120px] transition-all hover:opacity-75';
+export default function Button({
+  className,
+  href,
+  target,
+  onClick,
+  type,
+  children,
+  status = 'default',
+  disabled = false,
+  as,
+}: Props) {
+  const baseClasses =
+    'font-black inline-flex items-center gap-3 justify-center text-white text-center px-5 py-2 rounded-md min-w-[120px] transition-all hover:opacity-75';
 
-    const statusClass = status === 'primary' && 'bg-teal'
-        || status === 'danger' && 'bg-red-500'
-        || status === 'warning' && 'bg-yellow-400'
-        || status === 'info' && 'bg-blue-400'
-        || 'bg-gray-600';
+  const statusClass =
+    (status === 'primary' && 'bg-teal') ||
+    (status === 'danger' && 'bg-red-500') ||
+    (status === 'warning' && 'bg-yellow-400') ||
+    (status === 'info' && 'bg-blue-400') ||
+    'bg-gray-600';
 
-    const classes = `${className ?? ''} ${baseClasses} ${statusClass}`;
+  const classes = `${className ?? ''} ${baseClasses} ${statusClass}`;
 
-    if (onClick) {
-        return (
-            <button className={classes} type={type ?? 'button'} onClick={(e: React.MouseEvent) => onClick(e)} disabled={disabled}>
-                {children}
-            </button>
-        )
-    }
+  if (onClick) {
+    return (
+      <button
+        className={classes}
+        type={type ?? 'button'}
+        onClick={(e: React.MouseEvent) => onClick(e)}
+        disabled={disabled}
+      >
+        {children}
+      </button>
+    );
+  }
 
-    if (type) {
-        return (
-            <button className={classes} type={type ?? 'button'} disabled={disabled}>
-                {children}
-            </button>
-        )
-    }
+  if (type) {
+    return (
+      <button className={classes} type={type ?? 'button'} disabled={disabled}>
+        {children}
+      </button>
+    );
+  }
 
-    if (href) {
-        if (href.includes('http') || target === '_blank' || as === 'a') {
-            return (
-                <a href={href} target={target ?? '_self'} className={classes}>
-                    {children}
-                </a>
-            )
-        }
-
-        return (
-            <Link href={href} className={classes}>
-                {children}
-            </Link>
-        );
+  if (href) {
+    if (href.includes('http') || target === '_blank' || as === 'a') {
+      return (
+        <a href={href} target={target ?? '_self'} className={classes}>
+          {children}
+        </a>
+      );
     }
 
-    return <p className="text-red-500 text-sm">[Invalid button]</p>;
+    return (
+      <Link href={href} className={classes}>
+        {children}
+      </Link>
+    );
+  }
+
+  return <p className="text-red-500 text-sm">[Invalid button]</p>;
 }

package/src/components/common/Pagination.tsx

@@ -1,5 +1,5 @@
 import React from "react";
-import { Link } from "@inertiajs/inertia-react";
+import { Link } from "@inertiajs/react";
 import type { Meta } from "../../types";
 
 interface Props {

package/src/components/common/SimplePagination.tsx

@@ -0,0 +1,78 @@
+import React from "react";
+import { Link } from "@inertiajs/react";
+import { Meta } from "../../types";
+
+interface Props {
+    className?: string;
+    meta: Meta;
+    showPerPageSelector?: boolean;
+}
+
+export default function SimplePagination({ meta, className, showPerPageSelector = false }: Props) {
+    const { current_page, per_page, to, from } = meta;
+    const results_on_page = to - from + 1;
+    const has_more_pages = results_on_page === per_page;
+
+    function getNextPageLink() {
+        if (typeof window !== 'undefined') {
+            const search = new URLSearchParams(window.location.search);
+            search.set('page', String(current_page + 1));
+
+            return `?${search.toString()}`;
+        }
+
+        return '';
+    }
+
+    function getPrevPageLink() {
+        if (typeof window !== 'undefined') {
+            const search = new URLSearchParams(window.location.search);
+            search.set('page', String(current_page - 1));
+
+            return `?${search.toString()}`;
+        }
+
+        return '';
+    }
+
+    const nextPageLink = getNextPageLink();
+    const prevPageLink = getPrevPageLink();
+
+    function handlePerPageChange(e: React.SyntheticEvent<HTMLSelectElement>) {
+        const search = new URLSearchParams(window?.location.search);
+        search.set('limit', e.currentTarget.value);
+        search.set('page', '1');
+
+        window.location.href = `?${search.toString()}`;
+    }
+
+    return (
+        <div className={`${className ?? ''}`}>
+            <nav className="font-bold flex justify-between items-center gap-6">
+                <Link href={prevPageLink} className="flex items-center gap-2" disabled={current_page === 1}>
+                    <svg xmlns="http://www.w3.org/2000/svg" className="h-4 w-4" fill="none" viewBox="0 0 24 24" stroke="currentColor" strokeWidth="2">
+                        <path strokeLinecap="round" strokeLinejoin="round" d="M10 19l-7-7m0 0l7-7m-7 7h18" />
+                    </svg>
+                    Prev
+                </Link>
+                <div className="flex gap-6 items-center">
+                    <p>Page {current_page}</p>
+                    {showPerPageSelector ? (
+                        <select value={per_page} onChange={handlePerPageChange}>
+                            <option value="10">10 per page</option>
+                            <option value="25">25 per page</option>
+                            <option value="50">50 per page</option>
+                            <option value="100">100 per page</option>
+                        </select>
+                    ) : ''}
+                </div>
+                <Link href={nextPageLink} className="flex items-center gap-2" disabled={!has_more_pages}>
+                    Next
+                    <svg xmlns="http://www.w3.org/2000/svg" className="h-4 w-4" fill="none" viewBox="0 0 24 24" stroke="currentColor" strokeWidth="2">
+                        <path strokeLinecap="round" strokeLinejoin="round" d="M14 5l7 7m0 0l-7 7m7-7H3" />
+                    </svg>
+                </Link>
+            </nav>
+        </div>
+    )
+}

package/src/components/common/index.ts

@@ -1,6 +1,7 @@
 import Button from './Button';
 import Card from './Card';
 import Pagination from './Pagination';
+import SimplePagination from './SimplePagination';
 import ToastItem from './ToastItem';
 import Toasts from './Toasts';
 import Modal from './Modal';
@@ -9,6 +10,7 @@ export {
     Button,
     Card,
     Pagination,
+    SimplePagination,
     ToastItem,
     Toasts,
     Modal,

package/src/components/forms/ErrorList.tsx

@@ -1,32 +1,37 @@
 import React from 'react';
-import { ErrorBag, Errors } from "@inertiajs/inertia"
-import { Card } from "../common";
+import { ErrorBag, Errors } from '@inertiajs/core';
+import { Card } from '../common';
 
 interface Props {
-    heading?: string;
-    errors?: Errors & ErrorBag;
-    renderKeys?: boolean;
-    className?: string;
+  heading?: string;
+  errors?: Errors & ErrorBag;
+  renderKeys?: boolean;
+  className?: string;
 }
 
-export default function ErrorList({ heading = 'There was an error with your submission.', errors = {}, renderKeys = false, className = '' }: Props) {
-    if (Object.values(errors).length === 0) {
-        return <></>
-    }
+export default function ErrorList({
+  heading = 'There was an error with your submission.',
+  errors = {},
+  renderKeys = false,
+  className = '',
+}: Props) {
+  if (Object.values(errors).length === 0) {
+    return <></>;
+  }
 
-    return (
-        <aside className={`${className} col-span-full`}>
-            <Card className="border border-red-500 !bg-red-50">
-                <h2 className="font-black text-red-500 mb-2">{heading}</h2>
-                <ul className="space-y-2 list-disc ml-4">
-                    {Object.entries(errors).map(([field, message]) => (
-                        <li className="font-bold text-red-500" key={field}>
-                            {renderKeys && <strong>{field}: </strong>}
-                            { message }
-                        </li>
-                    ))}
-                </ul>
-            </Card>
-        </aside>
-    )
+  return (
+    <aside className={`${className} col-span-full`}>
+      <Card className="border border-red-500 !bg-red-50">
+        <h2 className="font-black text-red-500 mb-2">{heading}</h2>
+        <ul className="space-y-2 list-disc ml-4">
+          {Object.entries(errors).map(([field, message]) => (
+            <li className="font-bold text-red-500" key={field}>
+              {renderKeys && <strong>{field}: </strong>}
+              {message}
+            </li>
+          ))}
+        </ul>
+      </Card>
+    </aside>
+  );
 }

package/src/components/tables/TableHeader.tsx

@@ -1,49 +1,66 @@
-import React from "react";
-import { Link } from "@inertiajs/inertia-react";
+import React from 'react';
+import { Link } from '@inertiajs/react';
 
 interface Props {
-    children: React.ReactNode;
-    className?: string;
-    textAlign?: 'left' | 'right' | 'center';
-    sort?: string;
+  children: React.ReactNode;
+  className?: string;
+  textAlign?: 'left' | 'right' | 'center';
+  sort?: string;
 }
 
-export default function TableHeader({ children, className = '', sort, textAlign = 'left' }: Props) {
-    const [sortLink, setSortLink] = React.useState<string>('');
-
-    React.useEffect(() => {
-        if (typeof window !== 'undefined' && sort) {
-            const query = new URLSearchParams(window.location.search);
-
-            let direction: 'asc' | 'desc' = 'asc';
-
-            if (query.get('sort')) {
-                // Choose the opposite direction for sorting
-                direction = query.get('sort')?.includes('asc') ? 'desc' : 'asc';
-            }
-
-            query.set('sort', `${sort} ${direction}`);
-
-            setSortLink(`?${query.toString()}`);
-        }
-    }, []);
-
-    const textAlignClass = textAlign === 'center' && 'text-center justify-center'
-        || textAlign === 'right' && 'text-right justify-end'
-        || 'text-left justify-between';
-
-    return (
-        <th className={`${className} py-3.5 px-3 text-sm font-semibold text-left`}>
-            <div className={`flex items-center gap-3 ${textAlignClass}`}>
-                {children}
-                {sort && (
-                    <Link href={sortLink}>
-                        <svg xmlns="http://www.w3.org/2000/svg" className="h-5 w-5" fill="none" viewBox="0 0 24 24" stroke="currentColor" strokeWidth="2">
-                            <path strokeLinecap="round" strokeLinejoin="round" d="M8 9l4-4 4 4m0 6l-4 4-4-4" />
-                        </svg>
-                    </Link>
-                )}
-            </div>
-        </th>
-    )
+export default function TableHeader({
+  children,
+  className = '',
+  sort,
+  textAlign = 'left',
+}: Props) {
+  const [sortLink, setSortLink] = React.useState<string>('');
+
+  React.useEffect(() => {
+    if (typeof window !== 'undefined' && sort) {
+      const query = new URLSearchParams(window.location.search);
+
+      let direction: 'asc' | 'desc' = 'asc';
+
+      if (query.get('sort')) {
+        // Choose the opposite direction for sorting
+        direction = query.get('sort')?.includes('asc') ? 'desc' : 'asc';
+      }
+
+      query.set('sort', `${sort} ${direction}`);
+
+      setSortLink(`?${query.toString()}`);
+    }
+  }, []);
+
+  const textAlignClass =
+    (textAlign === 'center' && 'text-center justify-center') ||
+    (textAlign === 'right' && 'text-right justify-end') ||
+    'text-left justify-between';
+
+  return (
+    <th className={`${className} py-3.5 px-3 text-sm font-semibold text-left`}>
+      <div className={`flex items-center gap-3 ${textAlignClass}`}>
+        {children}
+        {sort && (
+          <Link href={sortLink}>
+            <svg
+              xmlns="http://www.w3.org/2000/svg"
+              className="h-5 w-5"
+              fill="none"
+              viewBox="0 0 24 24"
+              stroke="currentColor"
+              strokeWidth="2"
+            >
+              <path
+                strokeLinecap="round"
+                strokeLinejoin="round"
+                d="M8 9l4-4 4 4m0 6l-4 4-4-4"
+              />
+            </svg>
+          </Link>
+        )}
+      </div>
+    </th>
+  );
 }

package/src/lib/auth.tsx

@@ -1,8 +1,18 @@
-import { usePage } from '@inertiajs/inertia-react';
-import type { AuthContext, PageProps } from '../types';
+import { usePage } from '@inertiajs/react';
+import type { AuthContext } from '../types';
+import type { ErrorBag, Errors, Page, PageProps } from '@inertiajs/core';
+
+interface SharedProps {
+    auth: AuthContext;
+    errors: Errors & ErrorBag;
+}
+
+interface AppPage extends Page {
+    props: PageProps & SharedProps;
+}
 
 export function useAuth(): AuthContext {
-    const { props } = usePage<PageProps>() as PageProps;
+    const { props } = usePage() as AppPage;
 
     return props.auth;
 }

package/src/lib/calculatePricing.tsx

@@ -1,4 +1,4 @@
-import { addGst } from ".";
+import { addGst } from "./money";
 import type { PolicyEnhancement, QuoteRequestPurchaseOption } from "../types";
 
 interface CalculationArguments {

package/src/lib/inertiaOptions.tsx

@@ -1,4 +1,4 @@
-import type { VisitOptions } from '@inertiajs/inertia/types';
+import type { VisitOptions } from '@inertiajs/core';
 import { useToast } from './toast';
 
 interface Options {

package/src/lib/quoteRequestForm.tsx

@@ -1,13 +1,16 @@
 import React from 'react';
-import { InertiaFormProps, useForm } from "@inertiajs/inertia-react";
+import { useForm } from "@inertiajs/react";
+import { InertiaFormProps } from "@inertiajs/react/types/useForm";
 import type { QuoteRequest } from '../types';
 
+type QuoteRequestForm = QuoteRequest & Record<string, any>;
+
 interface QuoteRequestFormContextInterface {
-    form?: InertiaFormProps<QuoteRequest>;
+    form?: InertiaFormProps<QuoteRequestForm>;
     handleChange?: (e: React.ChangeEvent<HTMLInputElement|HTMLTextAreaElement|HTMLSelectElement>) => void;
 }
 
-export const initialData: QuoteRequest = {
+export const initialData: QuoteRequestForm = {
     id: undefined,
     status: 'new',
     source: 'phone',
@@ -71,7 +74,7 @@ export const initialData: QuoteRequest = {
 export const QuoteRequestFormContext = React.createContext<QuoteRequestFormContextInterface>({});
 
 export function QuoteRequestFormProvider({ children }: { children: React.ReactNode }) {
-    const form = useForm<QuoteRequest>(initialData);
+    const form = useForm(initialData);
 
     /**
      * Handle the change event for all form inputs

package/src/types/misc/index.ts

@@ -1,5 +1,3 @@
-export * from './inertia';
-
 export type FormStatus = 'idle' | 'processing' | 'success' | 'error';
 
 export interface Toast {

package/dist/types/misc/inertia.d.ts

@@ -1,8 +0,0 @@
-import type { ErrorBag, Errors, Page, PageProps as PagePropsInterface } from "@inertiajs/inertia";
-import { AuthContext } from '../../types';
-export interface PageProps extends Page<PagePropsInterface> {
-    props: {
-        auth: AuthContext;
-        errors: Errors & ErrorBag;
-    };
-}

package/src/types/misc/inertia.ts

@@ -1,9 +0,0 @@
-import type { ErrorBag, Errors, Page, PageProps as PagePropsInterface } from "@inertiajs/inertia";
-import { AuthContext } from '../../types';
-
-export interface PageProps extends Page<PagePropsInterface> {
-    props: {
-        auth: AuthContext;
-        errors: Errors & ErrorBag;
-    }
-}