feat(dashboard,icons,types,js-sdk): add providers to location UI (#8328)

This commit is contained in:
Riqwan Thamir
2024-07-30 08:47:01 +02:00
committed by GitHub
parent b539c6d5bb
commit c976361f22
22 changed files with 616 additions and 103 deletions

View File

@@ -11,6 +11,7 @@ import { HttpTypes } from "@medusajs/types"
import { sdk } from "../../lib/client"
import { queryClient } from "../../lib/query-client"
import { queryKeysFactory } from "../../lib/query-key-factory"
import { fulfillmentProvidersQueryKeys } from "./fulfillment-providers"
const STOCK_LOCATIONS_QUERY_KEY = "stock_locations" as const
export const stockLocationsQueryKeys = queryKeysFactory(
@@ -175,3 +176,28 @@ export const useCreateStockLocationFulfillmentSet = (
...options,
})
}
export const useUpdateStockLocationFulfillmentProviders = (
id: string,
options?: UseMutationOptions<
HttpTypes.AdminStockLocationResponse,
FetchError,
HttpTypes.AdminBatchLink
>
) => {
return useMutation({
mutationFn: (payload) =>
sdk.admin.stockLocation.updateFulfillmentProviders(id, payload),
onSuccess: async (data, variables, context) => {
await queryClient.invalidateQueries({
queryKey: stockLocationsQueryKeys.details(),
})
await queryClient.invalidateQueries({
queryKey: fulfillmentProvidersQueryKeys.all,
})
options?.onSuccess?.(data, variables, context)
},
...options,
})
}

View File

@@ -0,0 +1,25 @@
import { HttpTypes } from "@medusajs/types"
import { createColumnHelper } from "@tanstack/react-table"
import { useMemo } from "react"
import { useTranslation } from "react-i18next"
import {
TextCell,
TextHeader,
} from "../../../components/table/table-cells/common/text-cell"
import { formatProvider } from "../../../lib/format-provider"
const columnHelper = createColumnHelper<HttpTypes.AdminFulfillmentProvider>()
export const useFulfillmentProviderTableColumns = () => {
const { t } = useTranslation()
return useMemo(
() => [
columnHelper.accessor("id", {
header: () => <TextHeader text={"Provider"} />,
cell: ({ getValue }) => <TextCell text={formatProvider(getValue())} />,
}),
],
[t]
)
}

View File

@@ -0,0 +1,31 @@
import { HttpTypes } from "@medusajs/types"
import { useQueryParams } from "../../use-query-params"
type UseFulfillmentProviderTableQueryProps = {
prefix?: string
pageSize?: number
}
export const useFulfillmentProvidersTableQuery = ({
prefix,
pageSize = 20,
}: UseFulfillmentProviderTableQueryProps) => {
const queryObject = useQueryParams(
["offset", "q", "stock_location_id"],
prefix
)
const { offset, q, stock_location_id } = queryObject
const searchParams: HttpTypes.AdminFulfillmentProviderListParams = {
limit: pageSize,
offset: offset ? Number(offset) : 0,
stock_location_id,
q,
}
return {
searchParams,
raw: queryObject,
}
}

View File

@@ -1020,6 +1020,15 @@
"delete": {
"confirmation": "You are about to delete the stock location {{name}}. This action cannot be undone."
},
"fulfillmentProviders": {
"header": "Fulfillment Providers",
"shippingOptionsTooltip": "This dropdown will only consist of providers enabled for this location. Add them to the location if the dropdown is disabled.",
"label": "Connected fulfillment providers",
"connectedTo": "Connected to {{count}} of {{total}} fulfillment providers",
"noProviders": "This Stock Location is not connected to any fulfillment providers.",
"action": "Connect Providers",
"successToast": "Fulfillment providers for stock location were successfully updated."
},
"fulfillmentSets": {
"pickup": {
"header": "Pickup"

View File

@@ -871,6 +871,13 @@ export const RouteMap: RouteObject[] = [
lazy: () =>
import("../../routes/locations/location-sales-channels"),
},
{
path: "fulfillment-providers",
lazy: () =>
import(
"../../routes/locations/location-fulfillment-providers"
),
},
{
path: "fulfillment-set/:fset_id",
children: [

View File

@@ -0,0 +1 @@
export * from "./location-fulfillment-providers-section"

View File

@@ -0,0 +1,79 @@
import { HandTruck, PencilSquare } from "@medusajs/icons"
import { HttpTypes } from "@medusajs/types"
import { Container, Heading } from "@medusajs/ui"
import { useTranslation } from "react-i18next"
import { ActionMenu } from "../../../../../components/common/action-menu"
import { NoRecords } from "../../../../../components/common/empty-table-content"
import { IconAvatar } from "../../../../../components/common/icon-avatar"
import { useFulfillmentProviders } from "../../../../../hooks/api"
import { formatProvider } from "../../../../../lib/format-provider"
type LocationsFulfillmentProvidersSectionProps = {
location: HttpTypes.AdminStockLocation
}
function LocationsFulfillmentProvidersSection({
location,
}: LocationsFulfillmentProvidersSectionProps) {
const { t } = useTranslation()
const { fulfillment_providers } = useFulfillmentProviders({
stock_location_id: location.id,
fields: "id",
})
return (
<Container className="flex flex-col px-6 py-4">
<div className="flex items-center justify-between">
<Heading level="h2">
{t("stockLocations.fulfillmentProviders.header")}
</Heading>
<ActionMenu
groups={[
{
actions: [
{
label: t("actions.edit"),
to: "fulfillment-providers",
icon: <PencilSquare />,
},
],
},
]}
/>
</div>
{fulfillment_providers?.length ? (
<div className="flex flex-col gap-y-4 pt-4">
<div className="grid grid-cols-[28px_1fr] items-center gap-x-3 gap-y-3">
{fulfillment_providers?.map((fulfillmentProvider) => {
return (
<>
<IconAvatar>
<HandTruck className="text-ui-fg-subtle" />
</IconAvatar>
<div className="txt-compact-small">
{formatProvider(fulfillmentProvider.id)}
</div>
</>
)
})}
</div>
</div>
) : (
<NoRecords
className="h-fit pb-2 pt-6 text-center"
action={{
label: t("stockLocations.fulfillmentProviders.action"),
to: "fulfillment-providers",
}}
message={t("stockLocations.fulfillmentProviders.noProviders")}
/>
)}
</Container>
)
}
export default LocationsFulfillmentProvidersSection

View File

@@ -1,2 +1,2 @@
export const detailsFields =
"name,*sales_channels,*address,fulfillment_sets.type,fulfillment_sets.name,*fulfillment_sets.service_zones.geo_zones,*fulfillment_sets.service_zones,*fulfillment_sets.service_zones.shipping_options,*fulfillment_sets.service_zones.shipping_options.rules,*fulfillment_sets.service_zones.shipping_options.shipping_profile"
"name,*sales_channels,*address,fulfillment_sets.type,fulfillment_sets.name,*fulfillment_sets.service_zones.geo_zones,*fulfillment_sets.service_zones,*fulfillment_sets.service_zones.shipping_options,*fulfillment_sets.service_zones.shipping_options.rules,*fulfillment_sets.service_zones.shipping_options.shipping_profile,*fulfillment_providers"

View File

@@ -10,6 +10,7 @@ import after from "virtual:medusa/widgets/location/details/after"
import before from "virtual:medusa/widgets/location/details/before"
import sideAfter from "virtual:medusa/widgets/location/details/side/after"
import sideBefore from "virtual:medusa/widgets/location/details/side/before"
import LocationsFulfillmentProvidersSection from "./components/location-fulfillment-providers-section/location-fulfillment-providers-section"
import { detailsFields } from "./const"
export const LocationDetail = () => {
@@ -23,15 +24,7 @@ export const LocationDetail = () => {
isPending: isLoading,
isError,
error,
} = useStockLocation(
location_id!,
{
fields: detailsFields,
},
{
initialData,
}
)
} = useStockLocation(location_id!, { fields: detailsFields }, { initialData })
// TODO: Move to loading.tsx and set as Suspense fallback for the route
if (isLoading || !location) {
@@ -73,7 +66,10 @@ export const LocationDetail = () => {
</div>
)
})}
<LocationsSalesChannelsSection location={location} />
<LocationsFulfillmentProvidersSection location={location} />
{sideAfter.widgets.map((w, i) => {
return (
<div key={i}>

View File

@@ -0,0 +1,198 @@
import { HttpTypes } from "@medusajs/types"
import { Button, Checkbox, toast } from "@medusajs/ui"
import { keepPreviousData } from "@tanstack/react-query"
import { RowSelectionState, createColumnHelper } from "@tanstack/react-table"
import { useEffect, useMemo, useState } from "react"
import { useTranslation } from "react-i18next"
import * as zod from "zod"
import { zodResolver } from "@hookform/resolvers/zod"
import { useForm } from "react-hook-form"
import {
RouteFocusModal,
useRouteModal,
} from "../../../../../components/modals"
import { DataTable } from "../../../../../components/table/data-table"
import { useFulfillmentProviders } from "../../../../../hooks/api/fulfillment-providers"
import { useUpdateStockLocationFulfillmentProviders } from "../../../../../hooks/api/stock-locations"
import { useFulfillmentProviderTableColumns } from "../../../../../hooks/table/columns/use-fulfillment-provider-table-columns"
import { useDateTableFilters } from "../../../../../hooks/table/filters"
import { useFulfillmentProvidersTableQuery } from "../../../../../hooks/table/query/use-fulfillment-providers-table-query"
import { useDataTable } from "../../../../../hooks/use-data-table"
type LocationEditFulfillmentProvidersFormProps = {
location: HttpTypes.AdminStockLocation
}
const EditFulfillmentProvidersFormSchema = zod.object({
fulfillment_providers: zod.array(zod.string()).optional(),
})
const PAGE_SIZE = 50
export const LocationEditFulfillmentProvidersForm = ({
location,
}: LocationEditFulfillmentProvidersFormProps) => {
const { t } = useTranslation()
const { handleSuccess } = useRouteModal()
const form = useForm<zod.infer<typeof EditFulfillmentProvidersFormSchema>>({
defaultValues: {
fulfillment_providers:
location.fulfillment_providers?.map((fp) => fp.id) ?? [],
},
resolver: zodResolver(EditFulfillmentProvidersFormSchema),
})
const { setValue } = form
const initialState =
location.fulfillment_providers?.reduce((acc, curr) => {
acc[curr.id] = true
return acc
}, {} as RowSelectionState) ?? {}
const [rowSelection, setRowSelection] =
useState<RowSelectionState>(initialState)
useEffect(() => {
const ids = Object.keys(rowSelection)
setValue("fulfillment_providers", ids, {
shouldDirty: true,
shouldTouch: true,
})
}, [rowSelection, setValue])
const { searchParams, raw } = useFulfillmentProvidersTableQuery({
pageSize: PAGE_SIZE,
})
const { fulfillment_providers, count, isLoading, isError, error } =
useFulfillmentProviders(
{ ...searchParams },
{ placeholderData: keepPreviousData }
)
const filters = useDateTableFilters()
const columns = useColumns()
const { table } = useDataTable({
data: fulfillment_providers ?? [],
columns,
count,
enablePagination: true,
enableRowSelection: true,
rowSelection: {
state: rowSelection,
updater: setRowSelection,
},
getRowId: (row) => row.id,
pageSize: PAGE_SIZE,
})
const { mutateAsync, isPending: isMutating } =
useUpdateStockLocationFulfillmentProviders(location.id)
const handleSubmit = form.handleSubmit(async (data) => {
const originalIds = location.fulfillment_providers?.map((sc) => sc.id)
const arr = data.fulfillment_providers ?? []
await mutateAsync(
{
add: arr.filter((i) => !originalIds?.includes(i)),
remove: originalIds?.filter((i) => !arr.includes(i)),
},
{
onSuccess: () => {
toast.success(t("stockLocations.fulfillmentProviders.successToast"))
handleSuccess(`/settings/locations/${location.id}`)
},
onError: (e) => {
toast.error(e.message)
},
}
)
})
if (isError) {
throw error
}
return (
<RouteFocusModal.Form form={form}>
<div className="flex h-full flex-col overflow-hidden">
<RouteFocusModal.Body>
<DataTable
table={table}
columns={columns}
pageSize={PAGE_SIZE}
isLoading={isLoading}
count={count}
filters={filters}
search
pagination
orderBy={["id", "created_at", "updated_at"]}
queryObject={raw}
layout="fill"
/>
</RouteFocusModal.Body>
<RouteFocusModal.Footer>
<div className="flex items-center justify-end gap-x-2">
<RouteFocusModal.Close asChild>
<Button size="small" variant="secondary">
{t("actions.cancel")}
</Button>
</RouteFocusModal.Close>
<Button size="small" isLoading={isMutating} onClick={handleSubmit}>
{t("actions.save")}
</Button>
</div>
</RouteFocusModal.Footer>
</div>
</RouteFocusModal.Form>
)
}
const columnHelper = createColumnHelper<HttpTypes.AdminFulfillmentProvider>()
const useColumns = () => {
const columns = useFulfillmentProviderTableColumns()
return useMemo(
() => [
columnHelper.display({
id: "select",
header: ({ table }) => {
return (
<Checkbox
checked={
table.getIsSomePageRowsSelected()
? "indeterminate"
: table.getIsAllPageRowsSelected()
}
onCheckedChange={(value) =>
table.toggleAllPageRowsSelected(!!value)
}
/>
)
},
cell: ({ row }) => {
return (
<Checkbox
checked={row.getIsSelected()}
onCheckedChange={(value) => row.toggleSelected(!!value)}
onClick={(e) => {
e.stopPropagation()
}}
/>
)
},
}),
...columns,
],
[columns]
)
}

View File

@@ -0,0 +1 @@
export * from "./edit-fulfillment-providers-form"

View File

@@ -0,0 +1 @@
export { LocationFulfillmentProviders as Component } from "./location-fulfillment-providers"

View File

@@ -0,0 +1,27 @@
import { useParams } from "react-router-dom"
import { RouteFocusModal } from "../../../components/modals"
import { useStockLocation } from "../../../hooks/api/stock-locations"
import { LocationEditFulfillmentProvidersForm } from "./components/edit-fulfillment-providers-form"
export const LocationFulfillmentProviders = () => {
const { location_id } = useParams()
const { stock_location, isPending, isError, error } = useStockLocation(
location_id!,
{ fields: "id,*fulfillment_providers" }
)
const ready = !isPending && !!stock_location
if (isError) {
throw error
}
return (
<RouteFocusModal>
{ready && (
<LocationEditFulfillmentProvidersForm location={stock_location} />
)}
</RouteFocusModal>
)
}

View File

@@ -17,12 +17,14 @@ type CreateShippingOptionDetailsFormProps = {
form: UseFormReturn<CreateShippingOptionSchema>
isReturn?: boolean
zone: HttpTypes.AdminServiceZone
locationId: string
}
export const CreateShippingOptionDetailsForm = ({
form,
isReturn = false,
zone,
locationId,
}: CreateShippingOptionDetailsFormProps) => {
const { t } = useTranslation()
@@ -37,7 +39,11 @@ export const CreateShippingOptionDetailsForm = ({
})
const fulfillmentProviders = useComboboxData({
queryFn: (params) => sdk.admin.fulfillmentProvider.list(params),
queryFn: (params) =>
sdk.admin.fulfillmentProvider.list({
...params,
stock_location_id: locationId,
}),
queryKey: ["fulfillment_providers"],
getOptions: (data) =>
data.fulfillment_providers.map((provider) => ({
@@ -161,7 +167,11 @@ export const CreateShippingOptionDetailsForm = ({
render={({ field }) => {
return (
<Form.Item>
<Form.Label>
<Form.Label
tooltip={t(
"stockLocations.fulfillmentProviders.shippingOptionsTooltip"
)}
>
{t("stockLocations.shippingOptions.fields.provider")}
</Form.Label>
<Form.Control>

View File

@@ -257,6 +257,7 @@ export function CreateShippingOptionsForm({
form={form}
zone={zone}
isReturn={isReturn}
locationId={locationId}
/>
</ProgressTabs.Content>
<ProgressTabs.Content value={Tab.PRICING} className="size-full">

View File

@@ -49,7 +49,11 @@ export const EditShippingOptionForm = ({
})
const fulfillmentProviders = useComboboxData({
queryFn: (params) => sdk.admin.fulfillmentProvider.list(params),
queryFn: (params) =>
sdk.admin.fulfillmentProvider.list({
...params,
stock_location_id: locationId,
}),
queryKey: ["fulfillment_providers"],
getOptions: (data) =>
data.fulfillment_providers.map((provider) => ({
@@ -210,7 +214,11 @@ export const EditShippingOptionForm = ({
render={({ field }) => {
return (
<Form.Item>
<Form.Label>
<Form.Label
tooltip={t(
"stockLocations.fulfillmentProviders.shippingOptionsTooltip"
)}
>
{t("stockLocations.shippingOptions.fields.provider")}
</Form.Label>
<Form.Control>

View File

@@ -105,4 +105,19 @@ export class StockLocation {
}
)
}
async updateFulfillmentProviders(
id: string,
body: HttpTypes.AdminBatchLink,
headers?: ClientHeaders
) {
return await this.client.fetch<HttpTypes.AdminStockLocationResponse>(
`/admin/stock-locations/${id}/fulfillment-providers`,
{
method: "POST",
headers,
body,
}
)
}
}

View File

@@ -7,3 +7,8 @@ export interface FindParams extends SelectParams {
offset?: number
order?: string
}
export interface AdminBatchLink {
add?: string[]
remove?: string[]
}

View File

@@ -4,4 +4,5 @@ export interface AdminFulfillmentProviderListParams extends FindParams {
id?: string | string[]
q?: string
is_enabled?: boolean
stock_location_id?: string | string[]
}

View File

@@ -1,3 +1,4 @@
import { AdminFulfillmentProvider } from "../../fulfillment-provider"
import { AdminFulfillmentSet } from "../../fulfillment-set"
import { AdminSalesChannel } from "../../sales-channel"
@@ -19,5 +20,6 @@ export interface AdminStockLocation {
address_id: string
address?: AdminStockLocationAddress
sales_channels?: AdminSalesChannel[]
fulfillment_providers?: AdminFulfillmentProvider[]
fulfillment_sets?: AdminFulfillmentSet[]
}

View File

@@ -0,0 +1,69 @@
import * as React from "react"
import type { IconProps } from "../types"
const HandTruck = React.forwardRef<SVGSVGElement, IconProps>(
({ color = "currentColor", ...props }, ref) => {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
width={15}
height={15}
fill="none"
ref={ref}
{...props}
>
<g
stroke={color}
strokeLinecap="round"
strokeLinejoin="round"
strokeWidth={1.5}
clipPath="url(#a)"
>
<path
d="M10.6918 3.42715L6.96541 4.49011C6.50807 4.62056 6.24309 5.09706 6.37354 5.5544L7.31839 8.86672C7.44885 9.32405 7.92535 9.58904 8.38269 9.45858L12.109 8.39563C12.5664 8.26517 12.8314 7.78867 12.7009 7.33133L11.7561 4.01901C11.6256 3.56168 11.1491 3.29669 10.6918 3.42715Z"
stroke="#52525B"
strokeWidth="1.5"
strokeLinecap="round"
strokeLinejoin="round"
/>
<path
d="M8.82837 3.95886L9.30112 5.61478"
stroke="#52525B"
strokeWidth="1.5"
strokeLinecap="round"
strokeLinejoin="round"
/>
<path
d="M7.37573 12.2083L14.6736 10.127"
stroke="#52525B"
strokeWidth="1.5"
strokeLinecap="round"
strokeLinejoin="round"
/>
<path
d="M5.43299 10.8572L3.26988 3.24407C3.16482 2.87379 2.8264 2.61804 2.44149 2.61804H1.54163"
stroke="#52525B"
strokeWidth="1.5"
strokeLinecap="round"
strokeLinejoin="round"
/>
<path
d="M5.84728 13.8125C6.67954 13.8125 7.35422 13.1378 7.35422 12.3055C7.35422 11.4733 6.67954 10.7986 5.84728 10.7986C5.01501 10.7986 4.34033 11.4733 4.34033 12.3055C4.34033 13.1378 5.01501 13.8125 5.84728 13.8125Z"
stroke="#52525B"
strokeWidth="1.5"
strokeLinecap="round"
strokeLinejoin="round"
/>
</g>
<defs>
<clipPath id="a">
<path fill="#fff" d="M0 0h15v15H0z" />
</clipPath>
</defs>
</svg>
)
}
)
HandTruck.displayName = "HandTruck"
export default HandTruck

View File

@@ -1,26 +1,26 @@
// This file is generated automatically.
export { default as AcademicCapSolid } from "./academic-cap-solid"
export { default as AcademicCap } from "./academic-cap"
export { default as AdjustmentsDone } from "./adjustments-done"
export { default as AcademicCapSolid } from "./academic-cap-solid"
export { default as Adjustments } from "./adjustments"
export { default as AdjustmentsDone } from "./adjustments-done"
export { default as AiAssistent } from "./ai-assistent"
export { default as Apple } from "./apple"
export { default as ArchiveBox } from "./archive-box"
export { default as ArrowDown } from "./arrow-down"
export { default as ArrowDownCircle } from "./arrow-down-circle"
export { default as ArrowDownLeftMini } from "./arrow-down-left-mini"
export { default as ArrowDownLeft } from "./arrow-down-left"
export { default as ArrowDownLeftMini } from "./arrow-down-left-mini"
export { default as ArrowDownMini } from "./arrow-down-mini"
export { default as ArrowDownRightMini } from "./arrow-down-right-mini"
export { default as ArrowDownTray } from "./arrow-down-tray"
export { default as ArrowDown } from "./arrow-down"
export { default as ArrowLeftMini } from "./arrow-left-mini"
export { default as ArrowLeft } from "./arrow-left"
export { default as ArrowLeftMini } from "./arrow-left-mini"
export { default as ArrowLongDown } from "./arrow-long-down"
export { default as ArrowLongLeft } from "./arrow-long-left"
export { default as ArrowLongRight } from "./arrow-long-right"
export { default as ArrowLongUp } from "./arrow-long-up"
export { default as ArrowPathMini } from "./arrow-path-mini"
export { default as ArrowPath } from "./arrow-path"
export { default as ArrowPathMini } from "./arrow-path-mini"
export { default as ArrowRightMini } from "./arrow-right-mini"
export { default as ArrowRightOnRectangle } from "./arrow-right-on-rectangle"
export { default as ArrowUpCircleSolid } from "./arrow-up-circle-solid"
@@ -31,58 +31,58 @@ export { default as ArrowUpRightMini } from "./arrow-up-right-mini"
export { default as ArrowUpRightOnBox } from "./arrow-up-right-on-box"
export { default as ArrowUpTray } from "./arrow-up-tray"
export { default as ArrowUturnLeft } from "./arrow-uturn-left"
export { default as ArrowsPointingOutMini } from "./arrows-pointing-out-mini"
export { default as ArrowsPointingOut } from "./arrows-pointing-out"
export { default as ArrowsPointingOutMini } from "./arrows-pointing-out-mini"
export { default as ArrrowRight } from "./arrrow-right"
export { default as AtSymbol } from "./at-symbol"
export { default as BackwardSolid } from "./backward-solid"
export { default as BarsArrowDown } from "./bars-arrow-down"
export { default as BarsThree } from "./bars-three"
export { default as Beaker } from "./beaker"
export { default as BellAlertSolid } from "./bell-alert-solid"
export { default as BellAlert } from "./bell-alert"
export { default as BellAlertDone } from "./bell-alert-done"
export { default as BoltSolid } from "./bolt-solid"
export { default as BellAlertSolid } from "./bell-alert-solid"
export { default as Bolt } from "./bolt"
export { default as BookOpen } from "./book-open"
export { default as BoltSolid } from "./bolt-solid"
export { default as Book } from "./book"
export { default as BookOpen } from "./book-open"
export { default as Bookmarks } from "./bookmarks"
export { default as BottomToTop } from "./bottom-to-top"
export { default as BugAntSolid } from "./bug-ant-solid"
export { default as Bug } from "./bug"
export { default as BugAntSolid } from "./bug-ant-solid"
export { default as BuildingStorefront } from "./building-storefront"
export { default as BuildingTax } from "./building-tax"
export { default as Buildings } from "./buildings"
export { default as BuildingsMini } from "./buildings-mini"
export { default as BuildingsSolid } from "./buildings-solid"
export { default as Buildings } from "./buildings"
export { default as Calendar } from "./calendar"
export { default as CalendarMini } from "./calendar-mini"
export { default as CalendarSolid } from "./calendar-solid"
export { default as Calendar } from "./calendar"
export { default as Camera } from "./camera"
export { default as CashSolid } from "./cash-solid"
export { default as Cash } from "./cash"
export { default as ChannelsSolid } from "./channels-solid"
export { default as CashSolid } from "./cash-solid"
export { default as Channels } from "./channels"
export { default as ChannelsSolid } from "./channels-solid"
export { default as ChartBar } from "./chart-bar"
export { default as ChartPie } from "./chart-pie"
export { default as ChatBubbleLeftRightSolid } from "./chat-bubble-left-right-solid"
export { default as ChatBubbleLeftRight } from "./chat-bubble-left-right"
export { default as ChatBubble } from "./chat-bubble"
export { default as ChatBubbleLeftRight } from "./chat-bubble-left-right"
export { default as ChatBubbleLeftRightSolid } from "./chat-bubble-left-right-solid"
export { default as Check } from "./check"
export { default as CheckCircle } from "./check-circle"
export { default as CheckCircleMiniSolid } from "./check-circle-mini-solid"
export { default as CheckCircleSolid } from "./check-circle-solid"
export { default as CheckCircle } from "./check-circle"
export { default as CheckMini } from "./check-mini"
export { default as Check } from "./check"
export { default as ChevronDoubleLeftMiniSolid } from "./chevron-double-left-mini-solid"
export { default as ChevronDoubleLeft } from "./chevron-double-left"
export { default as ChevronDoubleRightMiniSolid } from "./chevron-double-right-mini-solid"
export { default as ChevronDoubleLeftMiniSolid } from "./chevron-double-left-mini-solid"
export { default as ChevronDoubleRight } from "./chevron-double-right"
export { default as ChevronDownMini } from "./chevron-down-mini"
export { default as ChevronDoubleRightMiniSolid } from "./chevron-double-right-mini-solid"
export { default as ChevronDown } from "./chevron-down"
export { default as ChevronLeftMini } from "./chevron-left-mini"
export { default as ChevronDownMini } from "./chevron-down-mini"
export { default as ChevronLeft } from "./chevron-left"
export { default as ChevronRightMini } from "./chevron-right-mini"
export { default as ChevronLeftMini } from "./chevron-left-mini"
export { default as ChevronRight } from "./chevron-right"
export { default as ChevronRightMini } from "./chevron-right-mini"
export { default as ChevronUpDown } from "./chevron-up-down"
export { default as ChevronUpMini } from "./chevron-up-mini"
export { default as CircleArrowUp } from "./circle-arrow-up"
@@ -93,34 +93,34 @@ export { default as CircleMiniFilledSolid } from "./circle-mini-filled-solid"
export { default as CircleMiniSolid } from "./circle-mini-solid"
export { default as CircleQuarterSolid } from "./circle-quarter-solid"
export { default as CircleSolid } from "./circle-solid"
export { default as CircleStackSolid } from "./circle-stack-solid"
export { default as CircleStack } from "./circle-stack"
export { default as CircleStackSolid } from "./circle-stack-solid"
export { default as CircleThreeQuartersSolid } from "./circle-three-quarters-solid"
export { default as ClockChangedSolidMini } from "./clock-changed-solid-mini"
export { default as ClockSolidMini } from "./clock-solid-mini"
export { default as ClockSolid } from "./clock-solid"
export { default as Clock } from "./clock"
export { default as ClockChangedSolidMini } from "./clock-changed-solid-mini"
export { default as ClockSolid } from "./clock-solid"
export { default as ClockSolidMini } from "./clock-solid-mini"
export { default as CloudArrowDown } from "./cloud-arrow-down"
export { default as CloudArrowUp } from "./cloud-arrow-up"
export { default as CogSixToothSolid } from "./cog-six-tooth-solid"
export { default as CogSixTooth } from "./cog-six-tooth"
export { default as CommandLineSolid } from "./command-line-solid"
export { default as CogSixToothSolid } from "./cog-six-tooth-solid"
export { default as CommandLine } from "./command-line"
export { default as ComponentSolid } from "./component-solid"
export { default as CommandLineSolid } from "./command-line-solid"
export { default as Component } from "./component"
export { default as ComputerDesktopSolid } from "./computer-desktop-solid"
export { default as ComponentSolid } from "./component-solid"
export { default as ComputerDesktop } from "./computer-desktop"
export { default as CreditCardSolid } from "./credit-card-solid"
export { default as ComputerDesktopSolid } from "./computer-desktop-solid"
export { default as CreditCard } from "./credit-card"
export { default as CreditCardSolid } from "./credit-card-solid"
export { default as CubeSolid } from "./cube-solid"
export { default as CurrencyDollarSolid } from "./currency-dollar-solid"
export { default as CurrencyDollar } from "./currency-dollar"
export { default as CurrencyDollarSolid } from "./currency-dollar-solid"
export { default as CursorArrowRays } from "./cursor-arrow-rays"
export { default as DescendingSorting } from "./descending-sorting"
export { default as Discord } from "./discord"
export { default as DocumentSeries } from "./document-series"
export { default as DocumentTextSolid } from "./document-text-solid"
export { default as DocumentText } from "./document-text"
export { default as DocumentTextSolid } from "./document-text-solid"
export { default as DotsSix } from "./dots-six"
export { default as EllipseBlueSolid } from "./ellipse-blue-solid"
export { default as EllipseGreenSolid } from "./ellipse-green-solid"
@@ -132,121 +132,122 @@ export { default as EllipseRedSolid } from "./ellipse-red-solid"
export { default as EllipseSolid } from "./ellipse-solid"
export { default as EllipsisHorizontal } from "./ellipsis-horizontal"
export { default as EllipsisVertical } from "./ellipsis-vertical"
export { default as EnvelopeSolid } from "./envelope-solid"
export { default as Envelope } from "./envelope"
export { default as ExclamationCircleSolid } from "./exclamation-circle-solid"
export { default as EnvelopeSolid } from "./envelope-solid"
export { default as ExclamationCircle } from "./exclamation-circle"
export { default as EyeMini } from "./eye-mini"
export { default as EyeSlashMini } from "./eye-slash-mini"
export { default as EyeSlash } from "./eye-slash"
export { default as ExclamationCircleSolid } from "./exclamation-circle-solid"
export { default as Eye } from "./eye"
export { default as EyeMini } from "./eye-mini"
export { default as EyeSlash } from "./eye-slash"
export { default as EyeSlashMini } from "./eye-slash-mini"
export { default as FaceSmile } from "./face-smile"
export { default as Facebook } from "./facebook"
export { default as Figma } from "./figma"
export { default as FlagMini } from "./flag-mini"
export { default as FlyingBox } from "./flying-box"
export { default as FolderIllustration } from "./folder-illustration"
export { default as FolderOpenIllustration } from "./folder-open-illustration"
export { default as FolderOpen } from "./folder-open"
export { default as Folder } from "./folder"
export { default as FolderIllustration } from "./folder-illustration"
export { default as FolderOpen } from "./folder-open"
export { default as FolderOpenIllustration } from "./folder-open-illustration"
export { default as ForwardSolid } from "./forward-solid"
export { default as Funnel } from "./funnel"
export { default as GatsbyEx } from "./gatsby-ex"
export { default as Gatsby } from "./gatsby"
export { default as GiftSolid } from "./gift-solid"
export { default as GatsbyEx } from "./gatsby-ex"
export { default as Gift } from "./gift"
export { default as GiftSolid } from "./gift-solid"
export { default as Github } from "./github"
export { default as Glasses } from "./glasses"
export { default as GlobeEuropeSolid } from "./globe-europe-solid"
export { default as GlobeEurope } from "./globe-europe"
export { default as GlobeEuropeSolid } from "./globe-europe-solid"
export { default as Google } from "./google"
export { default as GridList } from "./grid-list"
export { default as HandTruck } from "./hand-truck"
export { default as Hashtag } from "./hashtag"
export { default as Heart } from "./heart"
export { default as History } from "./history"
export { default as InboxSolid } from "./inbox-solid"
export { default as InformationCircleSolid } from "./information-circle-solid"
export { default as InformationCircle } from "./information-circle"
export { default as JavascriptEx } from "./javascript-ex"
export { default as InformationCircleSolid } from "./information-circle-solid"
export { default as Javascript } from "./javascript"
export { default as KeySolid } from "./key-solid"
export { default as JavascriptEx } from "./javascript-ex"
export { default as Key } from "./key"
export { default as KeySolid } from "./key-solid"
export { default as Keyboard } from "./keyboard"
export { default as KlarnaEx } from "./klarna-ex"
export { default as Klarna } from "./klarna"
export { default as KlarnaEx } from "./klarna-ex"
export { default as Klaviyo } from "./klaviyo"
export { default as Lifebuoy } from "./lifebuoy"
export { default as LightBulbSolid } from "./light-bulb-solid"
export { default as LightBulb } from "./light-bulb"
export { default as LightBulbSolid } from "./light-bulb-solid"
export { default as Link } from "./link"
export { default as Linkedin } from "./linkedin"
export { default as ListBullet } from "./list-bullet"
export { default as ListCheckbox } from "./list-checkbox"
export { default as ListTree } from "./list-tree"
export { default as Loader } from "./loader"
export { default as LockClosedSolidMini } from "./lock-closed-solid-mini"
export { default as LockClosedSolid } from "./lock-closed-solid"
export { default as LockClosedSolidMini } from "./lock-closed-solid-mini"
export { default as LockOpenSolid } from "./lock-open-solid"
export { default as MagnifierAlert } from "./magnifier-alert"
export { default as MagnifyingGlassMini } from "./magnifying-glass-mini"
export { default as MagnifyingGlass } from "./magnifying-glass"
export { default as MapPin } from "./map-pin"
export { default as MagnifyingGlassMini } from "./magnifying-glass-mini"
export { default as Map } from "./map"
export { default as MapPin } from "./map-pin"
export { default as Mastercard } from "./mastercard"
export { default as Medusa } from "./medusa"
export { default as Meta } from "./meta"
export { default as MinusMini } from "./minus-mini"
export { default as Minus } from "./minus"
export { default as MoonSolid } from "./moon-solid"
export { default as MinusMini } from "./minus-mini"
export { default as Moon } from "./moon"
export { default as MoonSolid } from "./moon-solid"
export { default as Newspaper } from "./newspaper"
export { default as NextJs } from "./next-js"
export { default as OpenRectArrowOut } from "./open-rect-arrow-out"
export { default as PaperClip } from "./paper-clip"
export { default as PauseSolid } from "./pause-solid"
export { default as PenPlus } from "./pen-plus"
export { default as PencilSquareSolid } from "./pencil-square-solid"
export { default as PencilSquare } from "./pencil-square"
export { default as Pencil } from "./pencil"
export { default as PencilSquare } from "./pencil-square"
export { default as PencilSquareSolid } from "./pencil-square-solid"
export { default as Phone } from "./phone"
export { default as PhotoSolid } from "./photo-solid"
export { default as Photo } from "./photo"
export { default as PhotoSolid } from "./photo-solid"
export { default as PlayMiniSolid } from "./play-mini-solid"
export { default as PlaySolid } from "./play-solid"
export { default as PlusMini } from "./plus-mini"
export { default as Plus } from "./plus"
export { default as PuzzleSolid } from "./puzzle-solid"
export { default as PlusMini } from "./plus-mini"
export { default as Puzzle } from "./puzzle"
export { default as QuestionMarkCircle } from "./question-mark-circle"
export { default as PuzzleSolid } from "./puzzle-solid"
export { default as QuestionMark } from "./question-mark"
export { default as QuestionMarkCircle } from "./question-mark-circle"
export { default as QueueList } from "./queue-list"
export { default as ReactJsEx } from "./react-js-ex"
export { default as ReactJs } from "./react-js"
export { default as ReceiptPercent } from "./receipt-percent"
export { default as ReactJsEx } from "./react-js-ex"
export { default as Receipt } from "./receipt"
export { default as ReceiptPercent } from "./receipt-percent"
export { default as ReplaySolid } from "./replay-solid"
export { default as Resize } from "./resize"
export { default as RocketLaunchSolid } from "./rocket-launch-solid"
export { default as RocketLaunch } from "./rocket-launch"
export { default as RocketLaunchSolid } from "./rocket-launch-solid"
export { default as Rss } from "./rss"
export { default as Sanity } from "./sanity"
export { default as ServerSolid } from "./server-solid"
export { default as ServerStackSolid } from "./server-stack-solid"
export { default as ServerStack } from "./server-stack"
export { default as Server } from "./server"
export { default as ServerSolid } from "./server-solid"
export { default as ServerStack } from "./server-stack"
export { default as ServerStackSolid } from "./server-stack-solid"
export { default as Share } from "./share"
export { default as ShoppingBag } from "./shopping-bag"
export { default as ShoppingCartSolid } from "./shopping-cart-solid"
export { default as ShoppingCart } from "./shopping-cart"
export { default as Shopping } from "./shopping"
export { default as ShoppingBag } from "./shopping-bag"
export { default as ShoppingCart } from "./shopping-cart"
export { default as ShoppingCartSolid } from "./shopping-cart-solid"
export { default as SidebarLeft } from "./sidebar-left"
export { default as SidebarRight } from "./sidebar-right"
export { default as Slack } from "./slack"
export { default as Snooze } from "./snooze"
export { default as SparklesMiniSolid } from "./sparkles-mini-solid"
export { default as SparklesMini } from "./sparkles-mini"
export { default as SparklesSolid } from "./sparkles-solid"
export { default as Sparkles } from "./sparkles"
export { default as SparklesMini } from "./sparkles-mini"
export { default as SparklesMiniSolid } from "./sparkles-mini-solid"
export { default as SparklesSolid } from "./sparkles-solid"
export { default as Spinner } from "./spinner"
export { default as SquareBlueSolid } from "./square-blue-solid"
export { default as SquareGreenSolid } from "./square-green-solid"
@@ -254,54 +255,54 @@ export { default as SquareGreySolid } from "./square-grey-solid"
export { default as SquareOrangeSolid } from "./square-orange-solid"
export { default as SquarePurpleSolid } from "./square-purple-solid"
export { default as SquareRedSolid } from "./square-red-solid"
export { default as SquareTwoStack } from "./square-two-stack"
export { default as SquareTwoStackMini } from "./square-two-stack-mini"
export { default as SquareTwoStackSolid } from "./square-two-stack-solid"
export { default as SquareTwoStack } from "./square-two-stack"
export { default as SquaresPlusSolid } from "./squares-plus-solid"
export { default as SquaresPlus } from "./squares-plus"
export { default as SquaresPlusSolid } from "./squares-plus-solid"
export { default as StackPerspective } from "./stack-perspective"
export { default as StarSolid } from "./star-solid"
export { default as Star } from "./star"
export { default as StarSolid } from "./star-solid"
export { default as Stopwatch } from "./stopwatch"
export { default as Stripe } from "./stripe"
export { default as SunSolid } from "./sun-solid"
export { default as Sun } from "./sun"
export { default as SwatchSolid } from "./swatch-solid"
export { default as SunSolid } from "./sun-solid"
export { default as Swatch } from "./swatch"
export { default as TagSolid } from "./tag-solid"
export { default as SwatchSolid } from "./swatch-solid"
export { default as Tag } from "./tag"
export { default as TagSolid } from "./tag-solid"
export { default as Tailwind } from "./tailwind"
export { default as Text } from "./text"
export { default as ThumbDown } from "./thumb-down"
export { default as ThumbUp } from "./thumb-up"
export { default as ThumbnailBadge } from "./thumbnail-badge"
export { default as TimelineVertical } from "./timeline-vertical"
export { default as ToolsSolid } from "./tools-solid"
export { default as Tools } from "./tools"
export { default as ToolsSolid } from "./tools-solid"
export { default as TopToBottom } from "./top-to-bottom"
export { default as Trash } from "./trash"
export { default as TriangleDownMini } from "./triangle-down-mini"
export { default as TriangleLeftMini } from "./triangle-left-mini"
export { default as TriangleRightMiniHover } from "./triangle-right-mini-hover"
export { default as TriangleRightMini } from "./triangle-right-mini"
export { default as TriangleRightMiniHover } from "./triangle-right-mini-hover"
export { default as TriangleUpMini } from "./triangle-up-mini"
export { default as TrianglesMini } from "./triangles-mini"
export { default as Trophy } from "./trophy"
export { default as TruckFast } from "./truck-fast"
export { default as TypescriptEx } from "./typescript-ex"
export { default as Typescript } from "./typescript"
export { default as TypescriptEx } from "./typescript-ex"
export { default as User } from "./user"
export { default as UserGroup } from "./user-group"
export { default as UserMini } from "./user-mini"
export { default as User } from "./user"
export { default as UsersSolid } from "./users-solid"
export { default as Users } from "./users"
export { default as UsersSolid } from "./users-solid"
export { default as Vercel } from "./vercel"
export { default as VerifiedBadge } from "./verified-badge"
export { default as Visa } from "./visa"
export { default as WandSparkle } from "./wand-sparkle"
export { default as Window } from "./window"
export { default as XCircleSolid } from "./x-circle-solid"
export { default as XCircle } from "./x-circle"
export { default as XMarkMini } from "./x-mark-mini"
export { default as XMark } from "./x-mark"
export { default as X } from "./x"
export { default as XCircle } from "./x-circle"
export { default as XCircleSolid } from "./x-circle-solid"
export { default as XMark } from "./x-mark"
export { default as XMarkMini } from "./x-mark-mini"