Skip to content

Commit d9db776

Browse files
committed
some refactors
1 parent 870e9c9 commit d9db776

File tree

8 files changed

+63
-72
lines changed

8 files changed

+63
-72
lines changed

apps/dashboard/app/(main)/websites/[id]/_components/analytics-toolbar.tsx

Lines changed: 5 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -39,11 +39,11 @@ const getStartDateForRange = (range: QuickRange) => {
3939
.toDate();
4040
};
4141

42-
interface AnalyticsToolbarProps {
42+
type AnalyticsToolbarProps = {
4343
isRefreshing: boolean;
4444
onRefresh: () => void;
4545
websiteId: string;
46-
}
46+
};
4747

4848
export function AnalyticsToolbar({
4949
isRefreshing,
@@ -99,7 +99,9 @@ export function AnalyticsToolbar({
9999

100100
const isQuickRangeActive = useCallback(
101101
(range: QuickRange) => {
102-
if (!(selectedRange?.from && selectedRange?.to)) return false;
102+
if (!(selectedRange?.from && selectedRange?.to)) {
103+
return false;
104+
}
103105

104106
const now = new Date();
105107
const start = getStartDateForRange(range);

apps/dashboard/app/(main)/websites/[id]/_components/tabs/audience-tab.tsx

Lines changed: 7 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -34,28 +34,28 @@ import type { FullTabProps } from "../utils/types";
3434
dayjs.extend(utc);
3535
dayjs.extend(timezone);
3636

37-
interface BrowserVersion {
37+
type BrowserVersion = {
3838
version: string;
3939
visitors: number;
4040
pageviews: number;
4141
percentage?: number;
42-
}
42+
};
4343

44-
interface BrowserEntry {
44+
type BrowserEntry = {
4545
name: string;
4646
browserName: string;
4747
visitors: number;
4848
pageviews: number;
4949
percentage: number;
5050
versions: BrowserVersion[];
51-
}
51+
};
5252

53-
interface ScreenResolutionEntry {
53+
type ScreenResolutionEntry = {
5454
name: string;
5555
visitors: number;
5656
pageviews?: number;
5757
percentage?: number;
58-
}
58+
};
5959

6060
const formatNumber = (value: number | null | undefined): string => {
6161
if (value == null || Number.isNaN(value)) {
@@ -409,7 +409,6 @@ export function WebsiteAudienceTab({
409409
</div>
410410
);
411411
}}
412-
showSearch={false}
413412
tabs={[
414413
{
415414
id: "browsers",
@@ -434,7 +433,6 @@ export function WebsiteAudienceTab({
434433
onAddFilter={(field: string, value: string) =>
435434
addFilter({ field, operator: "eq" as const, value })
436435
}
437-
showSearch={false}
438436
tabs={[
439437
{
440438
id: "connections",
@@ -582,7 +580,7 @@ export function WebsiteAudienceTab({
582580
{/* Enhanced Screen visualization with perspective */}
583581
<div className="perspective relative mb-4 flex h-32 justify-center">
584582
<div
585-
className="relative flex transform-gpu items-center justify-center rounded-lg border-2 border-primary/20 bg-gradient-to-br from-primary/8 to-primary/12 shadow-lg transition-all duration-300 hover:shadow-xl"
583+
className="relative flex transform-gpu items-center justify-center rounded-lg border-2 border-primary/20 bg-linear-to-br from-primary/8 to-primary/12 shadow-lg transition-all duration-300 hover:shadow-xl"
586584
style={{
587585
width: `${Math.min(200, 100 * Math.sqrt(aspectRatio))}px`,
588586
height: `${Math.min(160, 100 / Math.sqrt(aspectRatio))}px`,

apps/dashboard/app/(main)/websites/[id]/_components/tabs/overview-tab.tsx

Lines changed: 23 additions & 36 deletions
Original file line numberDiff line numberDiff line change
@@ -46,7 +46,7 @@ const CustomEventsSection = dynamic(() =>
4646
}))
4747
);
4848

49-
interface ChartDataPoint {
49+
type ChartDataPoint = {
5050
date: string;
5151
rawDate?: string;
5252
pageviews?: number;
@@ -55,36 +55,36 @@ interface ChartDataPoint {
5555
bounce_rate?: number;
5656
avg_session_duration?: number;
5757
[key: string]: unknown;
58-
}
58+
};
5959

60-
interface TechnologyData {
60+
type TechnologyData = {
6161
name: string;
6262
visitors: number;
6363
pageviews?: number;
6464
percentage: number;
6565
icon?: string;
6666
category?: string;
67-
}
67+
};
6868

69-
interface CellInfo {
69+
type CellInfo = {
7070
getValue: () => unknown;
7171
row: { original: unknown };
72-
}
72+
};
7373

74-
interface PageRowData {
74+
type PageRowData = {
7575
name: string;
7676
visitors: number;
7777
pageviews: number;
7878
percentage: number;
79-
}
79+
};
8080

81-
interface AnalyticsRowData {
81+
type AnalyticsRowData = {
8282
name: string;
8383
visitors: number;
8484
pageviews: number;
8585
percentage: number;
8686
referrer?: string;
87-
}
87+
};
8888

8989
const MIN_PREVIOUS_SESSIONS_FOR_TREND = 5;
9090
const MIN_PREVIOUS_VISITORS_FOR_TREND = 5;
@@ -313,7 +313,9 @@ export function WebsiteOverviewTab({
313313
const dateDiff = dateTo.diff(dateFrom, "day");
314314

315315
const processedEventsData = useMemo(() => {
316-
if (!analytics.events_by_date?.length) return [];
316+
if (!analytics.events_by_date?.length) {
317+
return [];
318+
}
317319

318320
const now = dayjs();
319321
const isHourly = dateRange.granularity === "hourly";
@@ -350,7 +352,9 @@ export function WebsiteOverviewTab({
350352
if (isHourly) {
351353
for (let hour = 0; hour < 24; hour++) {
352354
const hourDate = current.hour(hour);
353-
if (hourDate.isAfter(now)) break;
355+
if (hourDate.isAfter(now)) {
356+
break;
357+
}
354358

355359
const key = hourDate.format("YYYY-MM-DD HH:00:00");
356360
const existing = dataMap.get(key);
@@ -369,7 +373,9 @@ export function WebsiteOverviewTab({
369373
);
370374
}
371375
current = current.add(1, "day");
372-
if (current.isAfter(endDate, "day")) break;
376+
if (current.isAfter(endDate, "day")) {
377+
break;
378+
}
373379
} else {
374380
const key = current.format("YYYY-MM-DD");
375381
const existing = dataMap.get(key);
@@ -439,12 +445,14 @@ export function WebsiteOverviewTab({
439445
? event.date
440446
: event.date.slice(0, 10),
441447
value: transform
442-
? transform(event[field] as number)
448+
? transform(Number(event[field]))
443449
: (event[field] as number) || 0,
444450
}));
445451

446452
const formatSessionDuration = (value: number) => {
447-
if (value < 60) return Math.round(value);
453+
if (value < 60) {
454+
return Math.round(value);
455+
}
448456
const minutes = Math.floor(value / 60);
449457
const seconds = Math.round(value % 60);
450458
return minutes * 60 + seconds;
@@ -487,24 +495,6 @@ export function WebsiteOverviewTab({
487495
[]
488496
);
489497

490-
const formatTimeSeconds = useCallback((seconds: number): string => {
491-
if (seconds < 60) {
492-
return `${seconds.toFixed(1)}s`;
493-
}
494-
const minutes = Math.floor(seconds / 60);
495-
const remainingSeconds = Math.round(seconds % 60);
496-
return `${minutes}m ${remainingSeconds}s`;
497-
}, []);
498-
499-
const createTimeCell = (info: CellInfo) => {
500-
const seconds = (info.getValue() as number) ?? 0;
501-
return (
502-
<span className="font-medium text-foreground">
503-
{formatTimeSeconds(seconds)}
504-
</span>
505-
);
506-
};
507-
508498
const pagesTabs = useMemo(
509499
() => [
510500
{
@@ -1018,7 +1008,6 @@ export function WebsiteOverviewTab({
10181008
isLoading={isLoading}
10191009
minHeight={350}
10201010
onAddFilter={onAddFilter}
1021-
showSearch={false}
10221011
tabs={[
10231012
{
10241013
id: "devices",
@@ -1049,7 +1038,6 @@ export function WebsiteOverviewTab({
10491038
isLoading={isLoading}
10501039
minHeight={350}
10511040
onAddFilter={onAddFilter}
1052-
showSearch={false}
10531041
tabs={[
10541042
{
10551043
id: "browsers",
@@ -1073,7 +1061,6 @@ export function WebsiteOverviewTab({
10731061
isLoading={isLoading}
10741062
minHeight={350}
10751063
onAddFilter={onAddFilter}
1076-
showSearch={false}
10771064
tabs={[
10781065
{
10791066
id: "operating_systems",

apps/dashboard/app/(main)/websites/[id]/_components/tabs/performance-tab.tsx

Lines changed: 12 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -19,10 +19,10 @@ import { WebVitalsChart } from "./performance/_components/web-vitals-chart";
1919
import { WebVitalsMetricCell } from "./performance/_components/web-vitals-metric-cell";
2020
import { formatNumber } from "./performance/_utils/performance-utils";
2121

22-
interface CellProps {
22+
type CellProps = {
2323
getValue: () => unknown;
2424
row: { original: Record<string, unknown> };
25-
}
25+
};
2626

2727
const performanceColumns = [
2828
{
@@ -152,6 +152,10 @@ export function WebsitePerformanceTab({
152152
null
153153
);
154154

155+
const handleFilterChange = useCallback((filter: "fast" | "slow" | null) => {
156+
setActiveFilter(filter);
157+
}, []);
158+
155159
const {
156160
results: performanceResults,
157161
isLoading,
@@ -304,14 +308,14 @@ export function WebsitePerformanceTab({
304308
return countryName ? `${region}, ${countryName}` : name;
305309
};
306310

307-
interface TabConfig {
311+
type TabConfig = {
308312
id: string;
309313
label: string;
310314
data: PerformanceEntry[];
311315
iconRenderer?: (name: string) => React.ReactNode;
312316
nameFormatter?: (name: string) => string;
313317
getFilter: (row: { name: string }) => { field: string; value: string };
314-
}
318+
};
315319

316320
const configs: TabConfig[] = [
317321
{
@@ -433,14 +437,14 @@ export function WebsitePerformanceTab({
433437
return countryName ? `${region}, ${countryName}` : name;
434438
};
435439

436-
interface WebVitalsTabConfig {
440+
type WebVitalsTabConfig = {
437441
id: string;
438442
label: string;
439443
data: unknown[];
440444
iconRenderer?: (name: string) => React.ReactNode;
441445
nameFormatter?: (name: string) => string;
442446
getFilter: (row: { name: string }) => { field: string; value: string };
443-
}
447+
};
444448

445449
const webVitalsConfigs: WebVitalsTabConfig[] = [
446450
{
@@ -544,7 +548,7 @@ export function WebsitePerformanceTab({
544548

545549
<div className="rounded border bg-muted/20 p-4">
546550
<div className="mb-4 flex items-start gap-2">
547-
<LightningIcon className="mt-0.5 h-4 w-4 flex-shrink-0 text-primary" />
551+
<LightningIcon className="mt-0.5 h-4 w-4 shrink-0 text-primary" />
548552
<div>
549553
<p className="mb-1 font-medium text-foreground">
550554
Performance Overview
@@ -565,7 +569,7 @@ export function WebsitePerformanceTab({
565569
<>
566570
<PerformanceSummaryCard
567571
activeFilter={activeFilter}
568-
onFilterChange={setActiveFilter}
572+
onFilterChange={handleFilterChange}
569573
summary={performanceSummary}
570574
/>
571575

apps/dashboard/app/(main)/websites/[id]/_components/tabs/performance/_components/performance-metric-cell.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -6,10 +6,10 @@ import {
66
getMetricStyles,
77
} from "../_utils/performance-utils";
88

9-
interface PerformanceMetricCellProps {
9+
type PerformanceMetricCellProps = {
1010
value?: number;
1111
type?: "time" | "cls";
12-
}
12+
};
1313

1414
export function PerformanceMetricCell({
1515
value,

apps/dashboard/app/(main)/websites/[id]/_components/tabs/performance/_components/performance-summary-card.tsx

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -22,7 +22,7 @@ import {
2222
getPerformanceScoreColor,
2323
} from "../_utils/performance-utils";
2424

25-
interface FilterButtonProps {
25+
type FilterButtonProps = {
2626
filter: "fast" | "slow";
2727
icon: React.ComponentType<{ className?: string }>;
2828
label: string;
@@ -31,7 +31,7 @@ interface FilterButtonProps {
3131
colorClass: string;
3232
activeFilter: "fast" | "slow" | null;
3333
onFilterChange: (filter: "fast" | "slow" | null) => void;
34-
}
34+
};
3535

3636
const FilterButton = ({
3737
filter,
@@ -83,11 +83,11 @@ const FilterButton = ({
8383
);
8484
};
8585

86-
interface PerformanceSummaryCardProps {
86+
type PerformanceSummaryCardProps = {
8787
summary: PerformanceSummary;
8888
activeFilter: "fast" | "slow" | null;
89-
onFilterChange: (filter: "fast" | "slow" | null) => void;
90-
}
89+
onFilterChange: (filter: "fast" | "slow" | null) => void; // TODO: fix this
90+
};
9191

9292
export function PerformanceSummaryCard({
9393
summary,

0 commit comments

Comments
 (0)