+
-
+
-
);
}
diff --git a/apps/dashboard/app/(main)/websites/[id]/goals/page.tsx b/apps/dashboard/app/(main)/websites/[id]/goals/page.tsx
index 882f6465c..354cf21db 100644
--- a/apps/dashboard/app/(main)/websites/[id]/goals/page.tsx
+++ b/apps/dashboard/app/(main)/websites/[id]/goals/page.tsx
@@ -10,7 +10,6 @@ import { useDateFilters } from "@/hooks/use-date-filters";
import {
type CreateGoalData,
type Goal,
- type GoalAnalyticsRecord,
useBulkGoalAnalytics,
useGoals,
} from "@/hooks/use-goals";
@@ -20,16 +19,9 @@ import type { DynamicQueryFilter, GoalFilter } from "@/types/api";
import { EditGoalDialog } from "./_components/edit-goal-dialog";
import { GoalItemSkeleton } from "./_components/goal-item";
import { GoalsList } from "./_components/goals-list";
-import {
- ArrowClockwiseIcon,
- CheckCircleIcon,
- PlusIcon,
- TargetIcon,
- TrendUpIcon,
-} from "@databuddy/ui/icons";
-import { Button, Card } from "@databuddy/ui";
+import { ArrowClockwiseIcon, PlusIcon, TargetIcon } from "@databuddy/ui/icons";
+import { Button } from "@databuddy/ui";
import { DeleteDialog } from "@databuddy/ui/client";
-import { formatNumber } from "@/lib/formatters";
import { cn } from "@/lib/utils";
import { useAtomValue } from "jotai";
@@ -63,71 +55,6 @@ function toGoalFilters(filters: DynamicQueryFilter[]): GoalFilter[] {
}));
}
-function GoalsSummary({
- analytics,
- goals,
- isLoading,
-}: {
- analytics?: GoalAnalyticsRecord;
- goals: Goal[];
- isLoading: boolean;
-}) {
- const results = Object.values(analytics ?? {}).filter((result) => result.ok);
- const completions = results.reduce(
- (total, result) => total + result.data.total_users_completed,
- 0
- );
- const averageConversion =
- results.length > 0
- ? results.reduce(
- (total, result) => total + result.data.overall_conversion_rate,
- 0
- ) / results.length
- : 0;
-
- const cards = [
- {
- icon: TargetIcon,
- label: "Active goals",
- value: formatNumber(goals.filter((goal) => goal.isActive).length),
- },
- {
- icon: CheckCircleIcon,
- label: "Completions",
- value: formatNumber(completions),
- },
- {
- icon: TrendUpIcon,
- label: "Avg. conversion",
- value: `${averageConversion.toFixed(1)}%`,
- },
- ];
-
- return (
-
- {cards.map(({ icon: Icon, label, value }) => (
-
-
-
-
-
-
-
{label}
- {isLoading ? (
-
- ) : (
-
- {value}
-
- )}
-
- ))}
-
- );
-}
-
export default function GoalsPage() {
const { id } = useParams();
const websiteId = id as string;
@@ -242,53 +169,44 @@ export default function GoalsPage() {
-
- {
- setEditingGoal(null);
- setIsDialogOpen(true);
- },
+ {
+ setEditingGoal(null);
+ setIsDialogOpen(true);
},
- description:
- "Track single-step conversions like signups, purchases, or activation events.",
- icon: ,
- title: "No goals yet",
- }}
- errorProps={{
- action: { label: "Retry", onClick: () => refreshAction() },
- description:
- error?.message ??
- "Something went wrong while loading goal data.",
- icon: ,
- title: "Failed to load goals",
- }}
- loading={}
- outcome={listOutcome}
- >
- {(items) => (
- <>
-
- setDeletingGoalId(goalId)}
- onEditGoal={(goal) => {
- setEditingGoal(goal);
- setIsDialogOpen(true);
- }}
- />
-
- )}
-
-
+ },
+ description:
+ "Track single-step conversions like signups, purchases, or activation events.",
+ icon:
,
+ title: "No goals yet",
+ }}
+ errorProps={{
+ action: { label: "Retry", onClick: () => refreshAction() },
+ description:
+ error?.message ??
+ "Something went wrong while loading goal data.",
+ icon:
,
+ title: "Failed to load goals",
+ }}
+ loading={
}
+ outcome={listOutcome}
+ >
+ {(items) => (
+
setDeletingGoalId(goalId)}
+ onEditGoal={(goal) => {
+ setEditingGoal(goal);
+ setIsDialogOpen(true);
+ }}
+ />
+ )}
+
{isDialogOpen && (
diff --git a/apps/dashboard/app/(main)/websites/[id]/settings/general/page.tsx b/apps/dashboard/app/(main)/websites/[id]/settings/general/page.tsx
index 5d76224a2..a69e9e8ea 100644
--- a/apps/dashboard/app/(main)/websites/[id]/settings/general/page.tsx
+++ b/apps/dashboard/app/(main)/websites/[id]/settings/general/page.tsx
@@ -7,16 +7,21 @@ import { toast } from "sonner";
import { NoticeBanner } from "@/app/(main)/websites/_components/notice-banner";
import { useCopyToClipboard } from "@/hooks/use-copy-to-clipboard";
import {
+ getWebsiteByIdKey,
+ getWebsitesListKey,
updateWebsiteCache,
useDeleteWebsite,
useUpdateWebsite,
useWebsite,
type Website,
+ type WebsitesListData,
} from "@/hooks/use-websites";
import { orpc } from "@/lib/orpc";
+import { publicConfig } from "@databuddy/env/public";
import { TOAST_MESSAGES } from "../../_components/constants/settings-constants";
import {
ArrowRightIcon,
+ ArrowSquareOutIcon,
CheckIcon,
ClipboardIcon,
GlobeIcon,
@@ -71,6 +76,45 @@ export default function GeneralSettingsPage() {
const toggleMutation = useMutation({
...orpc.websites.togglePublic.mutationOptions(),
+ onMutate: async ({ id, isPublic: nextIsPublic }) => {
+ const getByIdKey = getWebsiteByIdKey(id);
+ const listKey = getWebsitesListKey();
+
+ await Promise.all([
+ queryClient.cancelQueries({ queryKey: getByIdKey }),
+ queryClient.cancelQueries({ queryKey: listKey }),
+ ]);
+
+ const previousWebsite = queryClient.getQueryData
(getByIdKey);
+ const previousList = queryClient.getQueryData(listKey);
+ const withPublicState = (website: Website): Website => ({
+ ...website,
+ isPublic: nextIsPublic,
+ });
+
+ queryClient.setQueryData(getByIdKey, (current) =>
+ current ? withPublicState(current) : current
+ );
+ queryClient.setQueryData(listKey, (current) =>
+ current
+ ? {
+ ...current,
+ websites: current.websites.map((website) =>
+ website.id === id ? withPublicState(website) : website
+ ),
+ }
+ : current
+ );
+
+ return { getByIdKey, listKey, previousList, previousWebsite };
+ },
+ onError: (_error, _variables, context) => {
+ if (!context) {
+ return;
+ }
+ queryClient.setQueryData(context.getByIdKey, context.previousWebsite);
+ queryClient.setQueryData(context.listKey, context.previousList);
+ },
onSuccess: (updatedWebsite: Website) => {
updateWebsiteCache(queryClient, updatedWebsite);
queryClient.invalidateQueries({
@@ -95,13 +139,14 @@ export default function GeneralSettingsPage() {
onCopy: () => toast.success("Public link copied to clipboard"),
});
- const isPublic = websiteData?.isPublic ?? false;
- const shareableLink = useMemo(() => {
- if (!(websiteData && typeof window !== "undefined")) {
- return "";
- }
- return `${window.location.origin}/public/${websiteId}`;
- }, [websiteData, websiteId]);
+ const isPublic =
+ (toggleMutation.isPending
+ ? toggleMutation.variables?.isPublic
+ : websiteData?.isPublic) ?? false;
+ const shareableLink = useMemo(
+ () => `${publicConfig.urls.dashboard}/public/${websiteId}`,
+ [websiteId]
+ );
const hasChanges =
!!websiteData &&
@@ -173,6 +218,10 @@ export default function GeneralSettingsPage() {
[websiteData, websiteId, toggleMutation]
);
+ const handleOpenPublicPage = useCallback(() => {
+ window.open(shareableLink, "_blank", "noopener,noreferrer");
+ }, [shareableLink]);
+
if (!websiteData) {
return ;
}
@@ -271,11 +320,11 @@ export default function GeneralSettingsPage() {