camox 0.48.0 → 0.52.1

package/dist/features/settings/FaviconSettings.js

@@ -0,0 +1,254 @@
+import { getApiUrl } from "../../lib/api-client.js";
+import { reads, useStudioCache } from "../../lib/studio-reads.js";
+import { buildDefaultFaviconUrl, buildFaviconUrl } from "../routes/pageRuntime.js";
+import { SettingsPart } from "./SettingsPart.js";
+import { useProjectMutation } from "./useProjectMutation.js";
+import { c } from "react/compiler-runtime";
+import * as React from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Button } from "@camox/ui/button";
+import { Trash2 } from "lucide-react";
+import { toast } from "@camox/ui/toaster";
+import { Spinner } from "@camox/ui/spinner";
+import { FaviconDropZone, validateFaviconFile } from "@camox/ui/favicon-drop-zone";
+
+//#region src/features/settings/FaviconSettings.tsx
+/** Points the studio tab's own icon at the saved favicon, so the change shows without a reload. */
+function refreshDocumentFavicon(href) {
+	for (const link of document.querySelectorAll("link[rel~=\"icon\"]")) link.href = href;
+}
+function FaviconSettings(t0) {
+	const $ = c(51);
+	const { project } = t0;
+	const studioCache = useStudioCache();
+	const [pending, setPending] = React.useState(null);
+	const [hasCurrent, setHasCurrent] = React.useState(false);
+	let t1;
+	if ($[0] !== project) {
+		t1 = buildFaviconUrl(getApiUrl(), project, { withDefault: false });
+		$[0] = project;
+		$[1] = t1;
+	} else t1 = $[1];
+	const currentUrl = t1;
+	let t2;
+	let t3;
+	if ($[2] !== currentUrl) {
+		t2 = () => {
+			const probe = new Image();
+			probe.onload = () => setHasCurrent(true);
+			probe.onerror = () => setHasCurrent(false);
+			probe.src = currentUrl;
+			return () => {
+				probe.onload = null;
+				probe.onerror = null;
+			};
+		};
+		t3 = [currentUrl];
+		$[2] = currentUrl;
+		$[3] = t2;
+		$[4] = t3;
+	} else {
+		t2 = $[3];
+		t3 = $[4];
+	}
+	React.useEffect(t2, t3);
+	const pendingFile = pending?.type === "upload" ? pending.file : null;
+	let t4;
+	if ($[5] !== pendingFile) {
+		t4 = pendingFile ? URL.createObjectURL(pendingFile) : null;
+		$[5] = pendingFile;
+		$[6] = t4;
+	} else t4 = $[6];
+	const pendingUrl = t4;
+	let t5;
+	let t6;
+	if ($[7] !== pendingUrl) {
+		t5 = () => {
+			if (!pendingUrl) return;
+			return () => URL.revokeObjectURL(pendingUrl);
+		};
+		t6 = [pendingUrl];
+		$[7] = pendingUrl;
+		$[8] = t5;
+		$[9] = t6;
+	} else {
+		t5 = $[8];
+		t6 = $[9];
+	}
+	React.useEffect(t5, t6);
+	let t7;
+	if ($[10] !== project || $[11] !== studioCache) {
+		t7 = () => {
+			const updated = studioCache.get(reads.project({ projectUuid: project.uuid }));
+			refreshDocumentFavicon(buildFaviconUrl(getApiUrl(), updated ?? project));
+			setPending(null);
+		};
+		$[10] = project;
+		$[11] = studioCache;
+		$[12] = t7;
+	} else t7 = $[12];
+	const onSuccess = t7;
+	let t8;
+	if ($[13] !== onSuccess) {
+		t8 = {
+			success: "Favicon updated",
+			failure: "Could not save the favicon",
+			onSuccess
+		};
+		$[13] = onSuccess;
+		$[14] = t8;
+	} else t8 = $[14];
+	const upload = useProjectMutation(project, "uploadFavicon", t8);
+	let t9;
+	if ($[15] !== onSuccess) {
+		t9 = {
+			success: "Favicon removed",
+			failure: "Could not save the favicon",
+			onSuccess
+		};
+		$[15] = onSuccess;
+		$[16] = t9;
+	} else t9 = $[16];
+	const remove = useProjectMutation(project, "deleteFavicon", t9);
+	const isSaving = upload.isPending || remove.isPending;
+	let t10;
+	if ($[17] === Symbol.for("react.memo_cache_sentinel")) {
+		t10 = (file) => {
+			const error = validateFaviconFile(file);
+			if (error) {
+				toast.error(error);
+				return;
+			}
+			setPending({
+				type: "upload",
+				file
+			});
+		};
+		$[17] = t10;
+	} else t10 = $[17];
+	const choose = t10;
+	let t11;
+	if ($[18] !== pending || $[19] !== project || $[20] !== remove || $[21] !== upload) {
+		t11 = () => {
+			if (pending?.type === "upload") {
+				upload.mutate({
+					projectId: project.id,
+					file: pending.file
+				});
+				return;
+			}
+			if (pending?.type === "remove") remove.mutate({ projectId: project.id });
+		};
+		$[18] = pending;
+		$[19] = project;
+		$[20] = remove;
+		$[21] = upload;
+		$[22] = t11;
+	} else t11 = $[22];
+	const save = t11;
+	const showsFavicon = pending ? pending.type === "upload" : hasCurrent;
+	let t12;
+	if ($[23] !== currentUrl || $[24] !== pendingUrl || $[25] !== showsFavicon) {
+		t12 = pendingUrl ?? (showsFavicon ? currentUrl : buildDefaultFaviconUrl(getApiUrl()));
+		$[23] = currentUrl;
+		$[24] = pendingUrl;
+		$[25] = showsFavicon;
+		$[26] = t12;
+	} else t12 = $[26];
+	const previewUrl = t12;
+	const prompt = pendingFile ? pendingFile.name : showsFavicon ? "Drop a new favicon, or click to browse" : "Drop your favicon here, or click to browse";
+	let t13;
+	if ($[27] !== isSaving || $[28] !== previewUrl || $[29] !== prompt) {
+		t13 = /* @__PURE__ */ jsx(FaviconDropZone, {
+			previewUrl,
+			prompt,
+			disabled: isSaving,
+			onFileSelected: choose
+		});
+		$[27] = isSaving;
+		$[28] = previewUrl;
+		$[29] = prompt;
+		$[30] = t13;
+	} else t13 = $[30];
+	const t14 = !pending || isSaving;
+	let t15;
+	if ($[31] !== isSaving) {
+		t15 = isSaving && /* @__PURE__ */ jsx(Spinner, {});
+		$[31] = isSaving;
+		$[32] = t15;
+	} else t15 = $[32];
+	let t16;
+	if ($[33] !== save || $[34] !== t14 || $[35] !== t15) {
+		t16 = /* @__PURE__ */ jsxs(Button, {
+			type: "button",
+			onClick: save,
+			disabled: t14,
+			children: [t15, "Save"]
+		});
+		$[33] = save;
+		$[34] = t14;
+		$[35] = t15;
+		$[36] = t16;
+	} else t16 = $[36];
+	let t17;
+	if ($[37] !== isSaving || $[38] !== pending) {
+		t17 = pending && /* @__PURE__ */ jsx(Button, {
+			type: "button",
+			variant: "outline",
+			disabled: isSaving,
+			onClick: () => setPending(null),
+			children: "Cancel"
+		});
+		$[37] = isSaving;
+		$[38] = pending;
+		$[39] = t17;
+	} else t17 = $[39];
+	let t18;
+	if ($[40] !== hasCurrent || $[41] !== isSaving || $[42] !== showsFavicon) {
+		t18 = showsFavicon && /* @__PURE__ */ jsxs(Button, {
+			type: "button",
+			variant: "ghost",
+			className: "ml-auto",
+			disabled: isSaving,
+			onClick: () => setPending(hasCurrent ? { type: "remove" } : null),
+			children: [/* @__PURE__ */ jsx(Trash2, {}), "Remove favicon"]
+		});
+		$[40] = hasCurrent;
+		$[41] = isSaving;
+		$[42] = showsFavicon;
+		$[43] = t18;
+	} else t18 = $[43];
+	let t19;
+	if ($[44] !== t16 || $[45] !== t17 || $[46] !== t18) {
+		t19 = /* @__PURE__ */ jsxs("div", {
+			className: "flex flex-wrap gap-2",
+			children: [
+				t16,
+				t17,
+				t18
+			]
+		});
+		$[44] = t16;
+		$[45] = t17;
+		$[46] = t18;
+		$[47] = t19;
+	} else t19 = $[47];
+	let t20;
+	if ($[48] !== t13 || $[49] !== t19) {
+		t20 = /* @__PURE__ */ jsx(SettingsPart, {
+			title: "Favicon",
+			description: "The icon shown in browser tabs and bookmarks.",
+			children: /* @__PURE__ */ jsxs("div", {
+				className: "flex flex-col gap-4",
+				children: [t13, t19]
+			})
+		});
+		$[48] = t13;
+		$[49] = t19;
+		$[50] = t20;
+	} else t20 = $[50];
+	return t20;
+}
+
+//#endregion
+export { FaviconSettings };

package/dist/features/settings/ProjectNameSettings.js

@@ -0,0 +1,145 @@
+import { SettingsPart } from "./SettingsPart.js";
+import { useProjectMutation } from "./useProjectMutation.js";
+import { c } from "react/compiler-runtime";
+import * as React from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Button } from "@camox/ui/button";
+import { Input } from "@camox/ui/input";
+import { Label } from "@camox/ui/label";
+import { Spinner } from "@camox/ui/spinner";
+
+//#region src/features/settings/ProjectNameSettings.tsx
+function ProjectNameSettings(t0) {
+	const $ = c(27);
+	const { project } = t0;
+	const [name, setName] = React.useState(project.name);
+	const [error, setError] = React.useState(null);
+	let t1;
+	if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
+		t1 = {
+			success: "Project name updated",
+			failure: "Could not update the project name"
+		};
+		$[0] = t1;
+	} else t1 = $[0];
+	const save = useProjectMutation(project, "update", t1);
+	let t2;
+	if ($[1] !== name) {
+		t2 = name.trim();
+		$[1] = name;
+		$[2] = t2;
+	} else t2 = $[2];
+	const trimmedName = t2;
+	let t3;
+	if ($[3] !== project.id || $[4] !== save || $[5] !== trimmedName) {
+		t3 = (event) => {
+			event.preventDefault();
+			if (!trimmedName) {
+				setError("Project name is required");
+				return;
+			}
+			save.mutate({
+				id: project.id,
+				name: trimmedName
+			});
+		};
+		$[3] = project.id;
+		$[4] = save;
+		$[5] = trimmedName;
+		$[6] = t3;
+	} else t3 = $[6];
+	const submit = t3;
+	let t4;
+	if ($[7] === Symbol.for("react.memo_cache_sentinel")) {
+		t4 = /* @__PURE__ */ jsx(Label, {
+			htmlFor: "camox-project-name",
+			children: "Project name"
+		});
+		$[7] = t4;
+	} else t4 = $[7];
+	const t5 = error ? true : void 0;
+	let t6;
+	if ($[8] === Symbol.for("react.memo_cache_sentinel")) {
+		t6 = (event_0) => {
+			setName(event_0.target.value);
+			setError(null);
+		};
+		$[8] = t6;
+	} else t6 = $[8];
+	let t7;
+	if ($[9] !== name || $[10] !== save.isPending || $[11] !== t5) {
+		t7 = /* @__PURE__ */ jsx(Input, {
+			id: "camox-project-name",
+			value: name,
+			"aria-invalid": t5,
+			disabled: save.isPending,
+			onChange: t6
+		});
+		$[9] = name;
+		$[10] = save.isPending;
+		$[11] = t5;
+		$[12] = t7;
+	} else t7 = $[12];
+	let t8;
+	if ($[13] !== error) {
+		t8 = error && /* @__PURE__ */ jsx("p", {
+			className: "text-destructive text-xs",
+			children: error
+		});
+		$[13] = error;
+		$[14] = t8;
+	} else t8 = $[14];
+	let t9;
+	if ($[15] !== t7 || $[16] !== t8) {
+		t9 = /* @__PURE__ */ jsxs("div", {
+			className: "flex flex-col gap-2",
+			children: [
+				t4,
+				t7,
+				t8
+			]
+		});
+		$[15] = t7;
+		$[16] = t8;
+		$[17] = t9;
+	} else t9 = $[17];
+	const t10 = trimmedName === project.name || save.isPending;
+	let t11;
+	if ($[18] !== save.isPending) {
+		t11 = save.isPending && /* @__PURE__ */ jsx(Spinner, {});
+		$[18] = save.isPending;
+		$[19] = t11;
+	} else t11 = $[19];
+	let t12;
+	if ($[20] !== t10 || $[21] !== t11) {
+		t12 = /* @__PURE__ */ jsxs(Button, {
+			type: "submit",
+			className: "self-start",
+			disabled: t10,
+			children: [t11, "Save changes"]
+		});
+		$[20] = t10;
+		$[21] = t11;
+		$[22] = t12;
+	} else t12 = $[22];
+	let t13;
+	if ($[23] !== submit || $[24] !== t12 || $[25] !== t9) {
+		t13 = /* @__PURE__ */ jsx(SettingsPart, {
+			title: "Project name",
+			description: "How the project is named in Camox.",
+			children: /* @__PURE__ */ jsxs("form", {
+				onSubmit: submit,
+				className: "flex flex-col gap-4",
+				children: [t9, t12]
+			})
+		});
+		$[23] = submit;
+		$[24] = t12;
+		$[25] = t9;
+		$[26] = t13;
+	} else t13 = $[26];
+	return t13;
+}
+
+//#endregion
+export { ProjectNameSettings };

package/dist/features/settings/SettingsPart.js

@@ -0,0 +1,73 @@
+import { c } from "react/compiler-runtime";
+import { jsx, jsxs } from "react/jsx-runtime";
+
+//#region src/features/settings/SettingsPart.tsx
+/** One part of the Settings Section: what it sets, beside the form that sets it. */
+function SettingsPart(t0) {
+	const $ = c(17);
+	const { title, description, children } = t0;
+	let t1;
+	if ($[0] !== title) {
+		let t2;
+		if ($[2] === Symbol.for("react.memo_cache_sentinel")) {
+			t2 = /\W+/g;
+			$[2] = t2;
+		} else t2 = $[2];
+		t1 = title.toLowerCase().replaceAll(t2, "-");
+		$[0] = title;
+		$[1] = t1;
+	} else t1 = $[1];
+	const id = `camox-settings-${t1}`;
+	let t2;
+	if ($[3] !== id || $[4] !== title) {
+		t2 = /* @__PURE__ */ jsx("h2", {
+			id,
+			className: "font-semibold",
+			children: title
+		});
+		$[3] = id;
+		$[4] = title;
+		$[5] = t2;
+	} else t2 = $[5];
+	let t3;
+	if ($[6] !== description) {
+		t3 = /* @__PURE__ */ jsx("p", {
+			className: "text-muted-foreground mt-1 text-sm",
+			children: description
+		});
+		$[6] = description;
+		$[7] = t3;
+	} else t3 = $[7];
+	let t4;
+	if ($[8] !== t2 || $[9] !== t3) {
+		t4 = /* @__PURE__ */ jsxs("div", { children: [t2, t3] });
+		$[8] = t2;
+		$[9] = t3;
+		$[10] = t4;
+	} else t4 = $[10];
+	let t5;
+	if ($[11] !== children) {
+		t5 = /* @__PURE__ */ jsx("div", {
+			className: "md:col-span-2",
+			children
+		});
+		$[11] = children;
+		$[12] = t5;
+	} else t5 = $[12];
+	let t6;
+	if ($[13] !== id || $[14] !== t4 || $[15] !== t5) {
+		t6 = /* @__PURE__ */ jsxs("section", {
+			"aria-labelledby": id,
+			className: "grid gap-4 md:grid-cols-3 md:gap-8",
+			children: [t4, t5]
+		});
+		$[13] = id;
+		$[14] = t4;
+		$[15] = t5;
+		$[16] = t6;
+	} else t6 = $[16];
+	return t6;
+}
+
+//#endregion
+export { SettingsPart };

package/dist/features/settings/SocialProfilesSettings.js

@@ -0,0 +1,245 @@
+import { SettingsPart } from "./SettingsPart.js";
+import { useProjectMutation } from "./useProjectMutation.js";
+import { c } from "react/compiler-runtime";
+import * as React from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Button } from "@camox/ui/button";
+import { Input } from "@camox/ui/input";
+import { ArrowDown, ArrowUp, Plus, Trash2 } from "lucide-react";
+import { Spinner } from "@camox/ui/spinner";
+import { socialProfileUrlSchema } from "@camox/api-contract/projects";
+
+//#region src/features/settings/SocialProfilesSettings.tsx
+let nextRowKey = 0;
+const row = (url) => ({
+	key: nextRowKey++,
+	url
+});
+function SocialProfilesSettings(t0) {
+	const $ = c(33);
+	const { project } = t0;
+	let t1;
+	if ($[0] !== project) {
+		t1 = () => project.socialProfiles.map(row);
+		$[0] = project;
+		$[1] = t1;
+	} else t1 = $[1];
+	const [rows, setRows] = React.useState(t1);
+	const [showErrors, setShowErrors] = React.useState(false);
+	let t2;
+	if ($[2] !== rows) {
+		t2 = rows.map(_temp).filter(_temp2);
+		$[2] = rows;
+		$[3] = t2;
+	} else t2 = $[3];
+	const filled = t2;
+	let t3;
+	if ($[4] !== filled) {
+		t3 = {
+			success: "Social profiles updated",
+			failure: "Could not save the social profiles",
+			onSuccess: () => {
+				setRows(filled);
+				setShowErrors(false);
+			}
+		};
+		$[4] = filled;
+		$[5] = t3;
+	} else t3 = $[5];
+	const save = useProjectMutation(project, "updateSocialProfiles", t3);
+	const errorOf = _temp3;
+	let t4;
+	if ($[6] === Symbol.for("react.memo_cache_sentinel")) {
+		t4 = (key, url_0) => setRows((current) => current.map((entry_0) => entry_0.key === key ? {
+			...entry_0,
+			url: url_0
+		} : entry_0));
+		$[6] = t4;
+	} else t4 = $[6];
+	const update = t4;
+	let t5;
+	if ($[7] === Symbol.for("react.memo_cache_sentinel")) {
+		t5 = (key_0) => setRows((current_0) => current_0.filter((entry_1) => entry_1.key !== key_0));
+		$[7] = t5;
+	} else t5 = $[7];
+	const remove = t5;
+	let t6;
+	if ($[8] === Symbol.for("react.memo_cache_sentinel")) {
+		t6 = (index, by) => setRows((current_1) => {
+			const next = [...current_1];
+			const [moved] = next.splice(index, 1);
+			next.splice(index + by, 0, moved);
+			return next;
+		});
+		$[8] = t6;
+	} else t6 = $[8];
+	const move = t6;
+	let t7;
+	if ($[9] !== filled || $[10] !== project || $[11] !== save) {
+		t7 = (event) => {
+			event.preventDefault();
+			if (filled.some((entry_2) => errorOf(entry_2.url))) {
+				setShowErrors(true);
+				return;
+			}
+			save.mutate({
+				id: project.id,
+				socialProfiles: filled.map(_temp4)
+			});
+		};
+		$[9] = filled;
+		$[10] = project;
+		$[11] = save;
+		$[12] = t7;
+	} else t7 = $[12];
+	const submit = t7;
+	let t8;
+	if ($[13] !== rows || $[14] !== save.isPending || $[15] !== showErrors) {
+		t8 = rows.length > 0 && /* @__PURE__ */ jsx("ol", {
+			className: "flex flex-col gap-2",
+			children: rows.map((entry_4, index_0) => {
+				const error = showErrors && entry_4.url.trim() ? errorOf(entry_4.url) : void 0;
+				return /* @__PURE__ */ jsxs("li", {
+					className: "flex flex-col gap-1",
+					children: [/* @__PURE__ */ jsxs("div", {
+						className: "flex items-center gap-1",
+						children: [
+							/* @__PURE__ */ jsx(Input, {
+								type: "url",
+								value: entry_4.url,
+								placeholder: "https://www.linkedin.com/company/…",
+								"aria-label": `Profile ${index_0 + 1}`,
+								"aria-invalid": error ? true : void 0,
+								disabled: save.isPending,
+								onChange: (event_0) => update(entry_4.key, event_0.target.value)
+							}),
+							/* @__PURE__ */ jsx(Button, {
+								type: "button",
+								variant: "ghost",
+								size: "icon",
+								"aria-label": "Move up",
+								disabled: index_0 === 0 || save.isPending,
+								onClick: () => move(index_0, -1),
+								children: /* @__PURE__ */ jsx(ArrowUp, {})
+							}),
+							/* @__PURE__ */ jsx(Button, {
+								type: "button",
+								variant: "ghost",
+								size: "icon",
+								"aria-label": "Move down",
+								disabled: index_0 === rows.length - 1 || save.isPending,
+								onClick: () => move(index_0, 1),
+								children: /* @__PURE__ */ jsx(ArrowDown, {})
+							}),
+							/* @__PURE__ */ jsx(Button, {
+								type: "button",
+								variant: "ghost",
+								size: "icon",
+								"aria-label": "Remove",
+								disabled: save.isPending,
+								onClick: () => remove(entry_4.key),
+								children: /* @__PURE__ */ jsx(Trash2, {})
+							})
+						]
+					}), error && /* @__PURE__ */ jsx("p", {
+						className: "text-destructive text-xs",
+						children: error
+					})]
+				}, entry_4.key);
+			})
+		});
+		$[13] = rows;
+		$[14] = save.isPending;
+		$[15] = showErrors;
+		$[16] = t8;
+	} else t8 = $[16];
+	let t9;
+	if ($[17] !== save.isPending) {
+		t9 = save.isPending && /* @__PURE__ */ jsx(Spinner, {});
+		$[17] = save.isPending;
+		$[18] = t9;
+	} else t9 = $[18];
+	let t10;
+	if ($[19] !== save.isPending || $[20] !== t9) {
+		t10 = /* @__PURE__ */ jsxs(Button, {
+			type: "submit",
+			disabled: save.isPending,
+			children: [t9, "Save"]
+		});
+		$[19] = save.isPending;
+		$[20] = t9;
+		$[21] = t10;
+	} else t10 = $[21];
+	let t11;
+	let t12;
+	if ($[22] === Symbol.for("react.memo_cache_sentinel")) {
+		t11 = () => setRows(_temp5);
+		t12 = /* @__PURE__ */ jsx(Plus, {});
+		$[22] = t11;
+		$[23] = t12;
+	} else {
+		t11 = $[22];
+		t12 = $[23];
+	}
+	let t13;
+	if ($[24] !== save.isPending) {
+		t13 = /* @__PURE__ */ jsxs(Button, {
+			type: "button",
+			variant: "ghost",
+			disabled: save.isPending,
+			onClick: t11,
+			children: [t12, "Add profile"]
+		});
+		$[24] = save.isPending;
+		$[25] = t13;
+	} else t13 = $[25];
+	let t14;
+	if ($[26] !== t10 || $[27] !== t13) {
+		t14 = /* @__PURE__ */ jsxs("div", {
+			className: "flex flex-wrap gap-2",
+			children: [t10, t13]
+		});
+		$[26] = t10;
+		$[27] = t13;
+		$[28] = t14;
+	} else t14 = $[28];
+	let t15;
+	if ($[29] !== submit || $[30] !== t14 || $[31] !== t8) {
+		t15 = /* @__PURE__ */ jsx(SettingsPart, {
+			title: "Social profiles",
+			description: "The project's accounts elsewhere, such as on LinkedIn, X or GitHub. Search engines and AI answer engines use them to tie the website to your organization.",
+			children: /* @__PURE__ */ jsxs("form", {
+				onSubmit: submit,
+				className: "flex flex-col gap-4",
+				children: [t8, t14]
+			})
+		});
+		$[29] = submit;
+		$[30] = t14;
+		$[31] = t8;
+		$[32] = t15;
+	} else t15 = $[32];
+	return t15;
+}
+function _temp5(current_2) {
+	return [...current_2, row("")];
+}
+function _temp4(entry_3) {
+	return entry_3.url;
+}
+function _temp3(url) {
+	const result = socialProfileUrlSchema.safeParse(url.trim());
+	return result.success ? void 0 : result.error.issues[0]?.message;
+}
+function _temp2(e) {
+	return e.url;
+}
+function _temp(entry) {
+	return {
+		...entry,
+		url: entry.url.trim()
+	};
+}
+
+//#endregion
+export { SocialProfilesSettings };