Skip to content

Commit 78cf923

Browse files
izadoesdevizadoesdev
committed
fix: websites org page
1 parent 96cc4db commit 78cf923

File tree

2 files changed

+90
-86
lines changed

2 files changed

+90
-86
lines changed

‎apps/dashboard/app/(main)/organizations/settings/websites/page.tsx‎

Lines changed: 5 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -5,9 +5,11 @@ import { useOrganizations } from '@/hooks/use-organizations';
55
import { WebsiteSettings } from './website-settings';
66

77
const ComponentSkeleton = () => (
8-
<div className="space-y-4">
9-
<div className="h-32 w-full animate-pulse rounded bg-muted" />
10-
<div className="h-24 w-full animate-pulse rounded bg-muted" />
8+
<div className="h-full p-6">
9+
<div className="space-y-4">
10+
<div className="h-32 w-full animate-pulse rounded bg-muted" />
11+
<div className="h-24 w-full animate-pulse rounded bg-muted" />
12+
</div>
1113
</div>
1214
);
1315

‎apps/dashboard/app/(main)/organizations/settings/websites/website-settings.tsx‎

Lines changed: 85 additions & 83 deletions
Original file line numberDiff line numberDiff line change
@@ -126,94 +126,96 @@ export function WebsiteSettings({ organization }: WebsiteSettingsProps) {
126126
});
127127

128128
return (
129-
<div className="space-y-6">
130-
{/* Website count indicator */}
131-
{!isLoadingWebsites && websites && websites.length > 0 && (
132-
<div className="flex items-center gap-2 rounded-lg border border-muted bg-muted/30 px-3 py-2 text-muted-foreground text-sm">
133-
<GlobeIcon
134-
aria-hidden="true"
135-
className="h-4 w-4 flex-shrink-0"
136-
size={16}
137-
weight="duotone"
138-
/>
139-
<span>
140-
Managing{' '}
141-
<span className="font-medium text-foreground">
142-
{websites.length}
143-
</span>{' '}
144-
website{websites.length !== 1 ? 's' : ''}
145-
</span>
146-
</div>
147-
)}
129+
<div className="h-full p-6">
130+
<div className="space-y-6">
131+
{/* Website count indicator */}
132+
{!isLoadingWebsites && websites && websites.length > 0 && (
133+
<div className="flex items-center gap-2 rounded-lg border border-muted bg-muted/30 px-3 py-2 text-muted-foreground text-sm">
134+
<GlobeIcon
135+
aria-hidden="true"
136+
className="h-4 w-4 flex-shrink-0"
137+
size={16}
138+
weight="duotone"
139+
/>
140+
<span>
141+
Managing{' '}
142+
<span className="font-medium text-foreground">
143+
{websites.length}
144+
</span>{' '}
145+
website{websites.length !== 1 ? 's' : ''}
146+
</span>
147+
</div>
148+
)}
148149

149-
{/* Loading state */}
150-
{isLoadingWebsites && <WebsiteLoadingSkeleton />}
150+
{/* Loading state */}
151+
{isLoadingWebsites && <WebsiteLoadingSkeleton />}
151152

152-
{/* Empty state */}
153-
{!isLoadingWebsites && websites && websites.length === 0 && (
154-
<EnhancedEmptyState />
155-
)}
153+
{/* Empty state */}
154+
{!isLoadingWebsites && websites && websites.length === 0 && (
155+
<EnhancedEmptyState />
156+
)}
156157

157-
{/* Website grid */}
158-
{!isLoadingWebsites && websites && websites.length > 0 && (
159-
<div className="grid gap-4 sm:grid-cols-2 lg:grid-cols-3">
160-
{websites.map((website) => (
161-
<Link
162-
aria-label={`View ${website.name} settings`}
163-
className="group block rounded focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary focus-visible:ring-offset-2 focus-visible:ring-offset-background"
164-
href={`/websites/${website.id}`}
165-
key={website.id}
166-
>
167-
<Card className="h-full overflow-hidden transition-all duration-300 ease-in-out group-hover:border-primary/50 group-hover:shadow-lg group-hover:shadow-primary/5">
168-
<CardHeader className="pb-3">
169-
<div className="flex items-center justify-between gap-2">
170-
<div className="flex min-w-0 flex-1 items-center gap-3">
171-
<FaviconImage
172-
altText={`${website.name} favicon`}
173-
className="flex-shrink-0 rounded"
174-
domain={website.domain}
175-
fallbackIcon={
176-
<div className="rounded bg-primary/10 p-1">
177-
<GlobeIcon
178-
className="h-4 w-4 text-primary"
179-
size={16}
180-
weight="duotone"
181-
/>
182-
</div>
183-
}
184-
size={24}
185-
/>
186-
<div className="min-w-0 flex-1">
187-
<h4 className="truncate font-semibold text-foreground text-sm transition-colors group-hover:text-primary">
188-
{website.name}
189-
</h4>
190-
<p className="truncate text-muted-foreground text-xs">
191-
{website.domain}
192-
</p>
158+
{/* Website grid */}
159+
{!isLoadingWebsites && websites && websites.length > 0 && (
160+
<div className="grid gap-4 sm:grid-cols-2 lg:grid-cols-3">
161+
{websites.map((website) => (
162+
<Link
163+
aria-label={`View ${website.name} settings`}
164+
className="group block rounded focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary focus-visible:ring-offset-2 focus-visible:ring-offset-background"
165+
href={`/websites/${website.id}`}
166+
key={website.id}
167+
>
168+
<Card className="h-full overflow-hidden transition-all duration-300 ease-in-out group-hover:border-primary/50 group-hover:shadow-lg group-hover:shadow-primary/5">
169+
<CardHeader className="pb-3">
170+
<div className="flex items-center justify-between gap-2">
171+
<div className="flex min-w-0 flex-1 items-center gap-3">
172+
<FaviconImage
173+
altText={`${website.name} favicon`}
174+
className="flex-shrink-0 rounded"
175+
domain={website.domain}
176+
fallbackIcon={
177+
<div className="rounded bg-primary/10 p-1">
178+
<GlobeIcon
179+
className="h-4 w-4 text-primary"
180+
size={16}
181+
weight="duotone"
182+
/>
183+
</div>
184+
}
185+
size={24}
186+
/>
187+
<div className="min-w-0 flex-1">
188+
<h4 className="truncate font-semibold text-foreground text-sm transition-colors group-hover:text-primary">
189+
{website.name}
190+
</h4>
191+
<p className="truncate text-muted-foreground text-xs">
192+
{website.domain}
193+
</p>
194+
</div>
193195
</div>
196+
<ArrowRightIcon
197+
aria-hidden="true"
198+
className="h-4 w-4 flex-shrink-0 text-muted-foreground transition-all duration-200 group-hover:translate-x-1 group-hover:text-primary"
199+
weight="fill"
200+
/>
194201
</div>
195-
<ArrowRightIcon
196-
aria-hidden="true"
197-
className="h-4 w-4 flex-shrink-0 text-muted-foreground transition-all duration-200 group-hover:translate-x-1 group-hover:text-primary"
198-
weight="fill"
199-
/>
200-
</div>
201-
</CardHeader>
202-
<CardContent className="pt-0 pb-4">
203-
<div className="flex items-center justify-between">
204-
<Badge
205-
className="border-primary/20 bg-primary/10 text-primary"
206-
variant="secondary"
207-
>
208-
Active
209-
</Badge>
210-
</div>
211-
</CardContent>
212-
</Card>
213-
</Link>
214-
))}
215-
</div>
216-
)}
202+
</CardHeader>
203+
<CardContent className="pt-0 pb-4">
204+
<div className="flex items-center justify-between">
205+
<Badge
206+
className="border-primary/20 bg-primary/10 text-primary"
207+
variant="secondary"
208+
>
209+
Active
210+
</Badge>
211+
</div>
212+
</CardContent>
213+
</Card>
214+
</Link>
215+
))}
216+
</div>
217+
)}
218+
</div>
217219
</div>
218220
);
219221
}

0 commit comments

Comments
 (0)