Updated date range handling.

src/app/(main)/settings/profile/DateRangeSetting.tsx

@@ -1,16 +1,15 @@
 import { DateFilter } from '@/components/input/DateFilter';
 import { Button, Row } from '@umami/react-zen';
 import { useDateRange, useMessages } from '@/components/hooks';
-import { DEFAULT_DATE_RANGE } from '@/lib/constants';
-import { DateRange } from '@/lib/types';
+import { DEFAULT_DATE_RANGE_VALUE } from '@/lib/constants';
 
 export function DateRangeSetting() {
   const { formatMessage, labels } = useMessages();
   const { dateRange, saveDateRange } = useDateRange();
   const { value } = dateRange;
 
-  const handleChange = (value: string | DateRange) => saveDateRange(value);
-  const handleReset = () => saveDateRange(DEFAULT_DATE_RANGE);
+  const handleChange = (value: string) => saveDateRange(value);
+  const handleReset = () => saveDateRange(DEFAULT_DATE_RANGE_VALUE);
 
   return (
     <Row gap="3">

src/app/(main)/settings/profile/ProfileSettings.tsx

@@ -33,7 +33,7 @@ export function ProfileSettings() {
   };
 
   return (
-    <Column gap="6">
+    <Column width="400px" gap="6">
       <Column>
         <Label>{formatMessage(labels.username)}</Label>
         {username}

src/app/(main)/settings/websites/[websiteId]/WebsiteSettings.tsx

@@ -5,7 +5,7 @@ import { useMessages } from '@/components/hooks';
 import { Globe, Arrow } from '@/components/icons';
 import { SectionHeader } from '@/components/common/SectionHeader';
 import { WebsiteShareForm } from './WebsiteShareForm';
-import { TrackingCode } from './TrackingCode';
+import { WebsiteTrackingCode } from './WebsiteTrackingCode';
 import { WebsiteData } from './WebsiteData';
 import { WebsiteEditForm } from './WebsiteEditForm';
 import { LinkButton } from '@/components/common/LinkButton';
@@ -23,11 +23,7 @@ export function WebsiteSettings({
   return (
     <>
       <SectionHeader title={website?.name} icon={<Globe />}>
-        <LinkButton
-          variant="primary"
-          href={`/websites/${websiteId}`}
-          target={openExternal ? '_blank' : null}
-        >
+        <LinkButton href={`/websites/${websiteId}`} target={openExternal ? '_blank' : null}>
           <Icon>
             <Arrow />
           </Icon>
@@ -45,10 +41,10 @@ export function WebsiteSettings({
           <WebsiteEditForm websiteId={websiteId} />
         </TabPanel>
         <TabPanel id="tracking">
-          <TrackingCode websiteId={websiteId} />
+          <WebsiteTrackingCode websiteId={websiteId} />
         </TabPanel>
         <TabPanel id="share">
-          <WebsiteShareForm />
+          <WebsiteShareForm websiteId={websiteId} />
         </TabPanel>
         <TabPanel id="data">
           <WebsiteData websiteId={websiteId} />

src/app/(main)/settings/websites/[websiteId]/WebsiteShareForm.tsx

@@ -22,7 +22,7 @@ const generateId = () => getRandomChars(16);
 
 export interface WebsiteShareFormProps {
   websiteId: string;
-  shareId: string;
+  shareId?: string;
   onSave?: () => void;
   onClose?: () => void;
 }

src/app/(main)/settings/websites/[websiteId]/WebsiteTrackingCode.tsx

@@ -1,9 +1,15 @@
-import { TextField } from '@umami/react-zen';
+import { TextField, Text, Column } from '@umami/react-zen';
 import { useMessages, useConfig } from '@/components/hooks';
 
 const SCRIPT_NAME = 'script.js';
 
-export function TrackingCode({ websiteId, hostUrl }: { websiteId: string; hostUrl?: string }) {
+export function WebsiteTrackingCode({
+  websiteId,
+  hostUrl,
+}: {
+  websiteId: string;
+  hostUrl?: string;
+}) {
   const { formatMessage, messages } = useMessages();
   const config = useConfig();
 
@@ -19,9 +25,9 @@ export function TrackingCode({ websiteId, hostUrl }: { websiteId: string; hostUr
   const code = `<script defer src="${url}" data-website-id="${websiteId}"></script>`;
 
   return (
-    <>
-      <p>{formatMessage(messages.trackingCode)}</p>
-      <TextField value={code} isReadOnly allowCopy asTextArea />
-    </>
+    <Column gap>
+      <Text>{formatMessage(messages.trackingCode)}</Text>
+      <TextField value={code} isReadOnly allowCopy asTextArea resize="none" />
+    </Column>
   );
 }