Updated icons.

src/components/common/ErrorMessage.tsx

@@ -1,6 +1,6 @@
 import { Icon, Text, Row } from '@umami/react-zen';
 import { useMessages } from '@/components/hooks';
-import { Alert } from '@/components/icons';
+import { AlertTriangle } from '@/components/icons';
 
 export function ErrorMessage() {
   const { formatMessage, messages } = useMessages();
@@ -8,7 +8,7 @@ export function ErrorMessage() {
   return (
     <Row alignItems="center" justifyContent="center" gap>
       <Icon>
-        <Alert />
+        <AlertTriangle />
       </Icon>
       <Text>{formatMessage(messages.error)}</Text>
     </Row>

src/components/common/FilterRecord.tsx

@@ -1,7 +1,7 @@
 import { useState } from 'react';
 import { Grid, Column, TextField, Label, Select, Icon, Button, ListItem } from '@umami/react-zen';
 import { useFilters, useFormat, useWebsiteValuesQuery } from '@/components/hooks';
-import { Close } from '@/components/icons';
+import { X } from '@/components/icons';
 import { isSearchOperator } from '@/lib/params';
 import { Empty } from '@/components/common/Empty';
 
@@ -107,7 +107,7 @@ export function FilterRecord({
         <Column justifyContent="flex-end">
           <Button variant="quiet" onPress={() => onRemove?.(name)}>
             <Icon>
-              <Close />
+              <X />
             </Icon>
           </Button>
         </Column>

src/components/common/Pager.tsx

@@ -1,6 +1,6 @@
 import { Button, Icon, Row, Text } from '@umami/react-zen';
 import { useMessages } from '@/components/hooks';
-import { Chevron } from '@/components/icons';
+import { ChevronRight } from '@/components/icons';
 
 export interface PagerProps {
   page: string | number;
@@ -45,12 +45,12 @@ export function Pager({ page, pageSize, count, onPageChange }: PagerProps) {
         <Row gap="1">
           <Button variant="outline" onPress={() => handlePageChange(-1)} isDisabled={firstPage}>
             <Icon size="sm" rotate={180}>
-              <Chevron />
+              <ChevronRight />
             </Icon>
           </Button>
           <Button variant="outline" onPress={() => handlePageChange(1)} isDisabled={lastPage}>
             <Icon size="sm">
-              <Chevron />
+              <ChevronRight />
             </Icon>
           </Button>
         </Row>

src/components/common/Panel.tsx

@@ -9,7 +9,7 @@ import {
   Tooltip,
   Heading,
 } from '@umami/react-zen';
-import { Maximize, Close } from '@/components/icons';
+import { Maximize, X } from '@/components/icons';
 import { useMessages } from '@/components/hooks';
 
 export interface PanelProps extends ColumnProps {
@@ -59,7 +59,7 @@ export function Panel({
         <Row justifyContent="flex-end" alignItems="center">
           <TooltipTrigger delay={0} isDisabled={isFullscreen}>
             <Button variant="quiet" onPress={handleFullscreen}>
-              <Icon>{isFullscreen ? <Close /> : <Maximize />}</Icon>
+              <Icon>{isFullscreen ? <X /> : <Maximize />}</Icon>
             </Button>
             <Tooltip>{formatMessage(labels.maximize)}</Tooltip>
           </TooltipTrigger>

src/components/icons.ts

@@ -1,71 +1,17 @@
+export * from 'lucide-react';
 export {
-  AlertTriangle as Alert,
-  ArrowRight as Arrow,
-  Bookmark,
-  Calendar,
-  ChartPie,
-  ChevronRight as Chevron,
-  Clock,
-  Copy,
-  Database,
-  Download,
-  Edit,
-  Ellipsis,
-  Equal,
-  Eye,
-  ExternalLink,
-  File,
-  FileJson,
-  FileText,
-  Globe,
-  Grid2X2 as Pixel,
-  KeyRound,
-  LayoutDashboard,
-  Link,
-  ListCheck,
-  ListFilter,
-  LockKeyhole,
-  LogOut,
-  Maximize,
-  Menu,
-  Minimize,
-  Moon,
-  MoreHorizontal as More,
-  Paperclip,
-  PanelLeft,
-  Plus,
-  RefreshCw as Refresh,
-  Settings,
-  Settings2 as Knobs,
-  Share,
-  Sheet,
-  Slash,
-  SquarePen,
-  SquarePlus,
-  Sun,
-  Trash,
-  Upload,
-  User,
-  CircleUserRound as UserCircle,
-  Users,
-  UserPlus,
-  X as Close,
-} from 'lucide-react';
-export {
-  Logo,
-  Bolt,
-  Change,
-  Compare,
-  Funnel,
-  Lightbulb,
-  Lightning,
-  Location,
-  Magnet,
-  Money,
-  Network,
-  Path,
-  Tag,
-  Target,
-  AddUser,
-  Visitor,
+  Logo as LogoSvg,
+  Bolt as BoltSvg,
+  Change as ChangeSvg,
+  Compare as CompareSvg,
+  Funnel as FunnelSvg,
+  Lightbulb as LightbulbSvg,
+  Lightning as LightningSvg,
+  Location as LocationSvg,
+  Magnet as MagnetSvg,
+  Money as MoneySvg,
+  Network as NetworkSvg,
+  Path as PathSvg,
+  Tag as TagSvg,
+  Target as TargetSvg,
 } from '@/components/svg';

src/components/input/FilterBar.tsx

@@ -16,7 +16,7 @@ import {
   useFilters,
   useWebsiteSegmentQuery,
 } from '@/components/hooks';
-import { Close, Bookmark } from '@/components/icons';
+import { X, Bookmark } from '@/components/icons';
 import { isSearchOperator } from '@/lib/params';
 import { SegmentEditForm } from '@/app/(main)/websites/[websiteId]/segments/SegmentEditForm';
 
@@ -111,7 +111,7 @@ export function FilterBar({ websiteId }: { websiteId: string }) {
         <TooltipTrigger delay={0}>
           <Button variant="zero" onPress={handleResetFilter}>
             <Icon>
-              <Close />
+              <X />
             </Icon>
           </Button>
           <Tooltip>
@@ -146,7 +146,7 @@ const FilterItem = ({ name, label, operator, value, onRemove }) => {
           </Text>
         </Row>
         <Icon onClick={() => onRemove(name)} size="xs" style={{ cursor: 'pointer' }}>
-          <Close />
+          <X />
         </Icon>
       </Row>
     </Row>

src/components/input/ReportEditButton.tsx

@@ -13,7 +13,7 @@ import {
   Text,
   Row,
 } from '@umami/react-zen';
-import { Edit, More, Trash } from '@/components/icons';
+import { Edit, MoreHorizontal, Trash } from '@/components/icons';
 
 export function ReportEditButton({
   id,
@@ -61,7 +61,7 @@ export function ReportEditButton({
       <MenuTrigger>
         <Button variant="quiet">
           <Icon>
-            <More />
+            <MoreHorizontal />
           </Icon>
         </Button>
         <Popover placement="bottom">
@@ -90,9 +90,7 @@ export function ReportEditButton({
             onCancel={handleClose}
             isDanger
           >
-            <Row gap="1">
-              {formatMessage(messages.confirmDelete, { target: <b key={name}>{name}</b> })}
-            </Row>
+            <Row gap="1">{formatMessage(messages.confirmDelete, { target: name })}</Row>
           </AlertDialog>
         )}
       </Modal>

src/components/input/TeamsButton.tsx

@@ -13,7 +13,7 @@ import {
   Loading,
 } from '@umami/react-zen';
 import { useLoginQuery, useMessages, useUserTeamsQuery, useNavigation } from '@/components/hooks';
-import { Chevron, User, Users } from '@/components/icons';
+import { ChevronRight, User, Users } from '@/components/icons';
 
 export interface TeamsButtonProps {
   showText?: boolean;
@@ -50,7 +50,7 @@ export function TeamsButton({ showText = true, onAction }: TeamsButtonProps) {
           </Row>
           {showText && (
             <Icon rotate={90} size="sm">
-              <Chevron />
+              <ChevronRight />
             </Icon>
           )}
         </Row>

src/components/input/WebsiteDateFilter.tsx

@@ -1,6 +1,6 @@
 import { Button, Icon, Row, Text, Select, ListItem } from '@umami/react-zen';
 import { isAfter } from 'date-fns';
-import { Chevron } from '@/components/icons';
+import { ChevronRight } from '@/components/icons';
 import { useDateRange, useMessages, useNavigation } from '@/components/hooks';
 import { DateFilter } from './DateFilter';
 
@@ -49,12 +49,12 @@ export function WebsiteDateFilter({
         <Row gap="1">
           <Button onPress={() => handleIncrement(-1)} variant="outline">
             <Icon rotate={180}>
-              <Chevron />
+              <ChevronRight />
             </Icon>
           </Button>
           <Button onPress={() => handleIncrement(1)} variant="outline" isDisabled={disableForward}>
             <Icon>
-              <Chevron />
+              <ChevronRight />
             </Icon>
           </Button>
         </Row>

src/components/metrics/ChangeLabel.tsx

@@ -1,6 +1,6 @@
 import { Icon, Text, Row, RowProps } from '@umami/react-zen';
 import { ReactNode } from 'react';
-import { Arrow } from '@/components/icons';
+import { ArrowRight } from '@/components/icons';
 
 const STYLES = {
   positive: {
@@ -51,7 +51,7 @@ export function ChangeLabel({
     >
       {!neutral && (
         <Icon rotate={positive ? -90 : 90} size={size}>
-          <Arrow />
+          <ArrowRight />
         </Icon>
       )}
       <Text>{children || value}</Text>

src/components/metrics/MetricsExpandedTable.tsx

@@ -2,7 +2,7 @@ import { ReactNode, useState } from 'react';
 import { Button, Column, DataColumn, DataTable, Icon, Row, SearchField } from '@umami/react-zen';
 import { LoadingPanel } from '@/components/common/LoadingPanel';
 import { useMessages, useWebsiteExpandedMetricsQuery } from '@/components/hooks';
-import { Close } from '@/components/icons';
+import { X } from '@/components/icons';
 import { DownloadButton } from '@/components/input/DownloadButton';
 import { formatShortTime } from '@/lib/format';
 import { MetricLabel } from '@/components/metrics/MetricLabel';
@@ -55,7 +55,7 @@ export function MetricsExpandedTable({
           {onClose && (
             <Button onPress={onClose} variant="quiet">
               <Icon>
-                <Close />
+                <X />
               </Icon>
             </Button>
           )}