refactor(icons): migrate workspace to Icones

This commit is contained in:
Maofeng
2026-09-20 15:52:22 +08:00
parent 1fc56b6982
commit ea00a71112
95 changed files with 1409 additions and 725 deletions
+4 -5
View File
@@ -19,7 +19,7 @@
"@base-ui/react": "^1.6.0",
"@base-ui/utils": "^0.3.1",
"@floating-ui/utils": "^0.2.12",
"@iconify/react": "^6.0.2",
"@icones/react": "^0.0.1",
"@lingui/core": "^6",
"@tanstack/react-form": "^1.33.2",
"@tanstack/react-hotkeys": "^0.10.0",
@@ -27,12 +27,10 @@
"@tanstack/react-router": "^1.170.18",
"@tanstack/react-start": "^1.168.32",
"@workspace/blocks": "workspace:*",
"@workspace/icons": "workspace:*",
"@workspace/i18n": "workspace:*",
"@workspace/lexical": "workspace:*",
"@workspace/search": "workspace:*",
"@workspace/ui": "workspace:*",
"country-flag-icons": "^1.6.20",
"lucide-react": "^1.27.0",
"react": "^19.2.6",
"react-day-picker": "^10.0.1",
"react-dom": "^19.2.6",
@@ -40,6 +38,7 @@
},
"devDependencies": {
"@tailwindcss/vite": "^4",
"@icones/vite": "^0.0.1",
"@testing-library/react": "^16.3.2",
"@types/node": "^24",
"@types/react": "^19",
@@ -51,4 +50,4 @@
"vite": "^8",
"vitest": "^4.1.10"
}
}
}
+1 -1
View File
@@ -8,7 +8,7 @@ import {
TriangleAlertIcon,
OctagonXIcon,
Loader2Icon,
} from "lucide-react"
} from "@workspace/ui/components/icon"
const Toaster = ({ ...props }: ToasterProps) => {
const [themeMode] = useUiState("theme-mode")
+77 -137
View File
@@ -1,63 +1,3 @@
import {
Alert02Icon,
Analytics01Icon,
AnalyticsUpIcon,
AppWindowIcon,
ArrowDataTransferHorizontalIcon,
BubbleChatIcon,
Calculator01Icon,
CallMissed01Icon,
CancelCircleIcon,
Chart01Icon,
ChartIncreaseIcon,
CheckmarkBadge01Icon,
CheckmarkCircle01Icon,
ClipboardListIcon,
Clock01Icon,
CodeSquareIcon,
Compass01Icon,
CreditCardIcon,
CrownIcon,
Delete02Icon,
DeliveryTruck01Icon,
Discount01Icon,
File01Icon,
GalleryHorizontalIcon,
GiftIcon,
HistoryIcon,
IdentityCardIcon,
InboxDownloadIcon,
InboxUploadIcon,
Invoice03Icon,
Key01Icon,
LinkCircleIcon,
Location01Icon,
LockKeyIcon,
Medal01Icon,
MoneySendSquareIcon,
Note01Icon,
Package02Icon,
PackageIcon,
Refresh01Icon,
RoadLocation01Icon,
SecurityWarningIcon,
Settings01Icon,
Settings03Icon,
Share01Icon,
ShoppingBag01Icon,
ShoppingCart01Icon,
StarCircleIcon,
StarIcon,
Store01Icon,
Structure01Icon,
Task01Icon,
Ticket01Icon,
UserGroupIcon,
UserShield01Icon,
Wallet01Icon,
WalletCardsIcon,
} from "@workspace/icons"
import type { NavigationGroup } from "@workspace/blocks/navigation"
import { navigationMessages } from "./navigation-messages"
@@ -71,19 +11,19 @@ export const primaryNavigationGroups: readonly NavigationGroup[] = [
id: "overview-dashboard",
to: "/",
label: navigationMessages["overview-dashboard"],
icon: Analytics01Icon,
icon: "huge:analytics-01",
},
{
id: "overview-realtime",
to: "/analytics/realtime",
label: navigationMessages["overview-realtime"],
icon: AnalyticsUpIcon,
icon: "huge:analytics-up",
},
{
id: "overview-tasks",
to: "/workspace/tasks",
label: navigationMessages["overview-tasks"],
icon: Task01Icon,
icon: "huge:task-01",
},
],
},
@@ -94,42 +34,42 @@ export const primaryNavigationGroups: readonly NavigationGroup[] = [
{
id: "catalog-products",
label: navigationMessages["catalog-products"],
icon: ShoppingBag01Icon,
icon: "huge:shopping-bag-01",
items: [
{
id: "catalog-products-list",
to: "/catalog/products/list",
label: navigationMessages["catalog-products-list"],
icon: ShoppingBag01Icon,
icon: "huge:shopping-bag-01",
},
{
id: "catalog-products-drafts",
to: "/catalog/products/drafts",
label: navigationMessages["catalog-products-drafts"],
icon: File01Icon,
icon: "huge:file-01",
},
{
id: "catalog-products-bundles",
to: "/catalog/products/bundles",
label: navigationMessages["catalog-products-bundles"],
icon: Package02Icon,
icon: "huge:package-02",
},
{
id: "catalog-products-attributes",
label: navigationMessages["catalog-products-attributes"],
icon: Settings03Icon,
icon: "huge:settings-03",
items: [
{
id: "catalog-product-specifications",
to: "/catalog/products/attributes/specifications",
label: navigationMessages["catalog-product-specifications"],
icon: ClipboardListIcon,
icon: "huge:clipboard",
},
{
id: "catalog-product-brands",
to: "/catalog/products/attributes/brands",
label: navigationMessages["catalog-product-brands"],
icon: StarIcon,
icon: "huge:star",
},
],
},
@@ -139,19 +79,19 @@ export const primaryNavigationGroups: readonly NavigationGroup[] = [
id: "catalog-categories",
to: "/catalog/categories",
label: navigationMessages["catalog-categories"],
icon: ClipboardListIcon,
icon: "huge:clipboard",
items: [
{
id: "catalog-category-tree",
to: "/catalog/categories/tree",
label: navigationMessages["catalog-category-tree"],
icon: Structure01Icon,
icon: "huge:structure-01",
},
{
id: "catalog-category-navigation",
to: "/catalog/categories/navigation",
label: navigationMessages["catalog-category-navigation"],
icon: Compass01Icon,
icon: "huge:compass-01",
},
],
},
@@ -159,37 +99,37 @@ export const primaryNavigationGroups: readonly NavigationGroup[] = [
id: "inventory-center",
to: "/inventory",
label: navigationMessages["inventory-center"],
icon: PackageIcon,
icon: "huge:package",
items: [
{
id: "inventory-overview",
to: "/inventory/overview",
label: navigationMessages["inventory-overview"],
icon: Chart01Icon,
icon: "huge:chart-01",
},
{
id: "inventory-inbound",
to: "/inventory/inbound",
label: navigationMessages["inventory-inbound"],
icon: InboxDownloadIcon,
icon: "huge:inbox-download",
},
{
id: "inventory-outbound",
to: "/inventory/outbound",
label: navigationMessages["inventory-outbound"],
icon: InboxUploadIcon,
icon: "huge:inbox-upload",
},
{
id: "inventory-transfers",
to: "/inventory/transfers",
label: navigationMessages["inventory-transfers"],
icon: ArrowDataTransferHorizontalIcon,
icon: "huge:arrow-data-transfer-horizontal",
},
{
id: "inventory-alerts",
to: "/inventory/alerts",
label: navigationMessages["inventory-alerts"],
icon: Alert02Icon,
icon: "huge:alert-02",
},
],
},
@@ -197,25 +137,25 @@ export const primaryNavigationGroups: readonly NavigationGroup[] = [
id: "content-assets",
to: "/content",
label: navigationMessages["content-assets"],
icon: File01Icon,
icon: "huge:file-01",
items: [
{
id: "content-articles",
to: "/content/articles",
label: navigationMessages["content-articles"],
icon: File01Icon,
icon: "huge:file-01",
},
{
id: "content-media",
to: "/content/media",
label: navigationMessages["content-media"],
icon: GalleryHorizontalIcon,
icon: "huge:album-01",
},
{
id: "content-pages",
to: "/content/pages",
label: navigationMessages["content-pages"],
icon: AppWindowIcon,
icon: "huge:browser",
},
],
},
@@ -229,37 +169,37 @@ export const primaryNavigationGroups: readonly NavigationGroup[] = [
id: "trade-orders",
to: "/trade/orders",
label: navigationMessages["trade-orders"],
icon: ShoppingCart01Icon,
icon: "huge:shopping-cart-01",
items: [
{
id: "trade-orders-awaiting-payment",
to: "/trade/orders/awaiting-payment",
label: navigationMessages["trade-orders-awaiting-payment"],
icon: WalletCardsIcon,
icon: "huge:wallet-cards",
},
{
id: "trade-orders-awaiting-shipment",
to: "/trade/orders/awaiting-shipment",
label: navigationMessages["trade-orders-awaiting-shipment"],
icon: PackageIcon,
icon: "huge:package",
},
{
id: "trade-orders-shipped",
to: "/trade/orders/shipped",
label: navigationMessages["trade-orders-shipped"],
icon: DeliveryTruck01Icon,
icon: "huge:delivery-truck-01",
},
{
id: "trade-orders-completed",
to: "/trade/orders/completed",
label: navigationMessages["trade-orders-completed"],
icon: CheckmarkCircle01Icon,
icon: "huge:checkmark-circle-01",
},
{
id: "trade-orders-canceled",
to: "/trade/orders/canceled",
label: navigationMessages["trade-orders-canceled"],
icon: CancelCircleIcon,
icon: "huge:cancel-circle",
},
],
},
@@ -267,25 +207,25 @@ export const primaryNavigationGroups: readonly NavigationGroup[] = [
id: "fulfillment-center",
to: "/fulfillment",
label: navigationMessages["fulfillment-center"],
icon: DeliveryTruck01Icon,
icon: "huge:delivery-truck-01",
items: [
{
id: "fulfillment-deliveries",
to: "/fulfillment/deliveries",
label: navigationMessages["fulfillment-deliveries"],
icon: Location01Icon,
icon: "huge:location-01",
},
{
id: "fulfillment-pickups",
to: "/fulfillment/pickups",
label: navigationMessages["fulfillment-pickups"],
icon: Store01Icon,
icon: "huge:store-01",
},
{
id: "fulfillment-freight-rules",
to: "/fulfillment/freight-rules",
label: navigationMessages["fulfillment-freight-rules"],
icon: RoadLocation01Icon,
icon: "huge:road-location-01",
},
],
},
@@ -293,25 +233,25 @@ export const primaryNavigationGroups: readonly NavigationGroup[] = [
id: "after-sales-center",
to: "/after-sales",
label: navigationMessages["after-sales-center"],
icon: CallMissed01Icon,
icon: "huge:call-missed-01",
items: [
{
id: "after-sales-returns",
to: "/after-sales/returns",
label: navigationMessages["after-sales-returns"],
icon: Refresh01Icon,
icon: "huge:refresh-01",
},
{
id: "after-sales-refunds",
to: "/after-sales/refunds",
label: navigationMessages["after-sales-refunds"],
icon: MoneySendSquareIcon,
icon: "huge:money-send-square",
},
{
id: "after-sales-disputes",
to: "/after-sales/disputes",
label: navigationMessages["after-sales-disputes"],
icon: SecurityWarningIcon,
icon: "huge:security-warning",
},
],
},
@@ -325,31 +265,31 @@ export const primaryNavigationGroups: readonly NavigationGroup[] = [
id: "customer-center",
to: "/customers",
label: navigationMessages["customer-center"],
icon: IdentityCardIcon,
icon: "huge:identity-card",
items: [
{
id: "customer-profiles",
to: "/customers/profiles",
label: navigationMessages["customer-profiles"],
icon: IdentityCardIcon,
icon: "huge:identity-card",
},
{
id: "customer-segments",
to: "/customers/segments",
label: navigationMessages["customer-segments"],
icon: UserGroupIcon,
icon: "huge:user-group",
},
{
id: "customer-tiers",
to: "/customers/tiers",
label: navigationMessages["customer-tiers"],
icon: CrownIcon,
icon: "huge:crown",
},
{
id: "customer-risk-list",
to: "/customers/risk-list",
label: navigationMessages["customer-risk-list"],
icon: SecurityWarningIcon,
icon: "huge:security-warning",
},
],
},
@@ -357,31 +297,31 @@ export const primaryNavigationGroups: readonly NavigationGroup[] = [
id: "marketing-campaigns",
to: "/marketing/campaigns",
label: navigationMessages["marketing-campaigns"],
icon: Discount01Icon,
icon: "huge:discount-01",
items: [
{
id: "marketing-coupons",
to: "/marketing/coupons",
label: navigationMessages["marketing-coupons"],
icon: Ticket01Icon,
icon: "huge:ticket-01",
},
{
id: "marketing-flash-sales",
to: "/marketing/flash-sales",
label: navigationMessages["marketing-flash-sales"],
icon: Clock01Icon,
icon: "huge:clock-01",
},
{
id: "marketing-gift-promotions",
to: "/marketing/gift-promotions",
label: navigationMessages["marketing-gift-promotions"],
icon: GiftIcon,
icon: "huge:gift",
},
{
id: "marketing-referrals",
to: "/marketing/referrals",
label: navigationMessages["marketing-referrals"],
icon: Share01Icon,
icon: "huge:share-01",
},
],
},
@@ -389,25 +329,25 @@ export const primaryNavigationGroups: readonly NavigationGroup[] = [
id: "loyalty-center",
to: "/loyalty",
label: navigationMessages["loyalty-center"],
icon: Medal01Icon,
icon: "huge:medal-01",
items: [
{
id: "loyalty-points",
to: "/loyalty/points",
label: navigationMessages["loyalty-points"],
icon: StarCircleIcon,
icon: "huge:star-circle",
},
{
id: "loyalty-stored-value",
to: "/loyalty/stored-value",
label: navigationMessages["loyalty-stored-value"],
icon: Wallet01Icon,
icon: "huge:wallet-01",
},
{
id: "loyalty-benefits",
to: "/loyalty/benefits",
label: navigationMessages["loyalty-benefits"],
icon: CheckmarkBadge01Icon,
icon: "huge:checkmark-badge-01",
},
],
},
@@ -421,31 +361,31 @@ export const primaryNavigationGroups: readonly NavigationGroup[] = [
id: "report-center",
to: "/reports",
label: navigationMessages["report-center"],
icon: Chart01Icon,
icon: "huge:chart-01",
items: [
{
id: "report-sales",
to: "/reports/sales",
label: navigationMessages["report-sales"],
icon: AnalyticsUpIcon,
icon: "huge:analytics-up",
},
{
id: "report-products",
to: "/reports/products",
label: navigationMessages["report-products"],
icon: ShoppingBag01Icon,
icon: "huge:shopping-bag-01",
},
{
id: "report-customers",
to: "/reports/customers",
label: navigationMessages["report-customers"],
icon: UserGroupIcon,
icon: "huge:user-group",
},
{
id: "report-channels",
to: "/reports/channels",
label: navigationMessages["report-channels"],
icon: ChartIncreaseIcon,
icon: "huge:chart-increase",
},
],
},
@@ -453,31 +393,31 @@ export const primaryNavigationGroups: readonly NavigationGroup[] = [
id: "finance-center",
to: "/finance",
label: navigationMessages["finance-center"],
icon: WalletCardsIcon,
icon: "huge:wallet-cards",
items: [
{
id: "finance-settlements",
to: "/finance/settlements",
label: navigationMessages["finance-settlements"],
icon: Invoice03Icon,
icon: "huge:invoice-03",
},
{
id: "finance-reconciliation",
to: "/finance/reconciliation",
label: navigationMessages["finance-reconciliation"],
icon: Calculator01Icon,
icon: "huge:calculator-01",
},
{
id: "finance-invoices",
to: "/finance/invoices",
label: navigationMessages["finance-invoices"],
icon: File01Icon,
icon: "huge:file-01",
},
{
id: "finance-payouts",
to: "/finance/payouts",
label: navigationMessages["finance-payouts"],
icon: MoneySendSquareIcon,
icon: "huge:money-send-square",
},
],
},
@@ -491,25 +431,25 @@ export const primaryNavigationGroups: readonly NavigationGroup[] = [
id: "system-members",
to: "/system/members",
label: navigationMessages["system-members"],
icon: UserShield01Icon,
icon: "huge:user-shield-01",
items: [
{
id: "system-members-admins",
to: "/system/members/admins",
label: navigationMessages["system-members-admins"],
icon: UserShield01Icon,
icon: "huge:user-shield-01",
},
{
id: "system-members-roles",
to: "/system/members/roles",
label: navigationMessages["system-members-roles"],
icon: UserGroupIcon,
icon: "huge:user-group",
},
{
id: "system-members-permissions",
to: "/system/members/permissions",
label: navigationMessages["system-members-permissions"],
icon: LockKeyIcon,
icon: "huge:lock-key",
},
],
},
@@ -517,19 +457,19 @@ export const primaryNavigationGroups: readonly NavigationGroup[] = [
id: "system-notifications",
to: "/system/notifications",
label: navigationMessages["system-notifications"],
icon: BubbleChatIcon,
icon: "huge:bubble-chat",
items: [
{
id: "system-notification-templates",
to: "/system/notifications/templates",
label: navigationMessages["system-notification-templates"],
icon: File01Icon,
icon: "huge:file-01",
},
{
id: "system-notification-logs",
to: "/system/notifications/logs",
label: navigationMessages["system-notification-logs"],
icon: HistoryIcon,
icon: "huge:time-schedule",
},
],
},
@@ -537,25 +477,25 @@ export const primaryNavigationGroups: readonly NavigationGroup[] = [
id: "system-audit",
to: "/system/audit",
label: navigationMessages["system-audit"],
icon: Note01Icon,
icon: "huge:note-01",
},
{
id: "system-integrations",
to: "/system/integrations",
label: navigationMessages["system-integrations"],
icon: CodeSquareIcon,
icon: "huge:code-square",
items: [
{
id: "system-integration-api-keys",
to: "/system/integrations/api-keys",
label: navigationMessages["system-integration-api-keys"],
icon: Key01Icon,
icon: "huge:key-01",
},
{
id: "system-integration-webhooks",
to: "/system/integrations/webhooks",
label: navigationMessages["system-integration-webhooks"],
icon: LinkCircleIcon,
icon: "huge:link-circle",
},
],
},
@@ -563,25 +503,25 @@ export const primaryNavigationGroups: readonly NavigationGroup[] = [
id: "system-settings",
to: "/system-configs",
label: navigationMessages["system-settings"],
icon: Settings01Icon,
icon: "huge:settings-01",
items: [
{
id: "system-settings-store",
to: "/system-configs/store",
label: navigationMessages["system-settings-store"],
icon: Store01Icon,
icon: "huge:store-01",
},
{
id: "system-settings-payments",
to: "/system-configs/payments",
label: navigationMessages["system-settings-payments"],
icon: CreditCardIcon,
icon: "huge:credit-card",
},
{
id: "system-settings-shipping",
to: "/system-configs/shipping",
label: navigationMessages["system-settings-shipping"],
icon: DeliveryTruck01Icon,
icon: "huge:delivery-truck-01",
},
],
},
@@ -589,7 +529,7 @@ export const primaryNavigationGroups: readonly NavigationGroup[] = [
id: "system-recycle-bin",
to: "/system/recycle-bin",
label: navigationMessages["system-recycle-bin"],
icon: Delete02Icon,
icon: "huge:delete-02",
},
],
},
+4 -10
View File
@@ -1,9 +1,3 @@
import {
DeliveryTruck01Icon,
Mail01Icon,
Message01Icon,
PackageIcon,
} from "@workspace/icons"
import type { QueryFunctionContext } from "@tanstack/react-query"
import type { Notification } from "@workspace/blocks/notifications"
@@ -68,7 +62,7 @@ export const fallbackNotifications: readonly Notification[] = [
isRead: true,
media: {
kind: "icon",
icon: PackageIcon,
icon: "huge:package",
tone: "warning",
},
},
@@ -81,7 +75,7 @@ export const fallbackNotifications: readonly Notification[] = [
isRead: true,
media: {
kind: "icon",
icon: DeliveryTruck01Icon,
icon: "huge:delivery-truck-01",
tone: "success",
},
},
@@ -94,7 +88,7 @@ export const fallbackNotifications: readonly Notification[] = [
isRead: true,
media: {
kind: "icon",
icon: Message01Icon,
icon: "huge:message-01",
tone: "info",
},
},
@@ -106,7 +100,7 @@ export const fallbackNotifications: readonly Notification[] = [
isRead: true,
media: {
kind: "icon",
icon: Mail01Icon,
icon: "huge:mail-01",
tone: "destructive",
},
},
+6 -9
View File
@@ -1,4 +1,4 @@
import { CN, US } from "country-flag-icons/react/1x1"
import { Icon } from "@icones/react"
import {
DropdownMenu,
DropdownMenuContent,
@@ -13,11 +13,6 @@ import { HeaderActionButton } from "@workspace/blocks/layout"
import { appLocales, isAppLocale, type AppLocaleCountry } from "./app-locales"
import { useAppLocale } from "./app-i18n-provider"
const localeFlags = {
CN,
US,
} satisfies Record<AppLocaleCountry, typeof CN>
function LocaleFlag({
country,
className,
@@ -25,8 +20,6 @@ function LocaleFlag({
className?: string
country: AppLocaleCountry
}) {
const Flag = localeFlags[country]
return (
<span
aria-hidden="true"
@@ -35,7 +28,11 @@ function LocaleFlag({
className
)}
>
<Flag className="size-full" />
{country === "CN" ? (
<Icon name="flag:cn-square" className="size-full" />
) : (
<Icon name="flag:us-square" className="size-full" />
)}
</span>
)
}
+1 -1
View File
@@ -2,7 +2,7 @@ import React, { useState } from "react"
import { useMutation } from "@tanstack/react-query"
import { Button } from "@workspace/ui/components/button"
import { Input } from "@workspace/ui/components/input"
import { EyeIcon, EyeOffIcon } from "lucide-react"
import { EyeIcon, EyeOffIcon } from "@workspace/ui/components/icon"
import { cn } from "@workspace/ui/lib/utils"
import { ThemeToggleButton } from "@workspace/blocks/blocks/appearance"
import { Logo } from "@/components/logo"
+2 -3
View File
@@ -1,5 +1,6 @@
import path from "path"
import tailwindcss from "@tailwindcss/vite"
import { icones } from "@icones/vite"
import { tanstackStart } from "@tanstack/react-start/plugin/vite"
import { i18n } from "@workspace/i18n/vite"
import react from "@vitejs/plugin-react"
@@ -14,11 +15,9 @@ export default defineConfig({
"@": path.resolve(__dirname, "./src"),
},
},
optimizeDeps: {
include: ["use-sync-external-store/shim/with-selector"],
},
plugins: [
i18n(),
icones({ mode: "symbol", emitData: false }),
tailwindcss(),
tanstackStart({
router: {
+2 -1
View File
@@ -1,9 +1,10 @@
import path from "node:path"
import { icones } from "@icones/vite"
import react from "@vitejs/plugin-react"
import { defineConfig } from "vitest/config"
export default defineConfig({
plugins: [react()],
plugins: [icones({ mode: "symbol", emitData: false }), react()],
resolve: {
alias: {
"@": path.resolve(__dirname, "./src"),