ciphera-net/pulse
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 15 Wiki Activity

feat(settings): add public link sharing functionality and improve UI for password protection

Browse Source
This commit is contained in:
Usman Baig
2026-01-18 19:06:56 +01:00
parent 1c2c5a71ae
commit 14a71db04a
1 changed files with 50 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files

65
app/sites/[id]/settings/page.tsx
View File

@@ -40,6 +40,7 @@ export default function SiteSettingsPage() {
excluded_paths: ''
})
const [scriptCopied, setScriptCopied] = useState(false)
const [linkCopied, setLinkCopied] = useState(false)
useEffect(() => {
loadSite()
@@ -127,6 +128,14 @@ export default function SiteSettingsPage() {
setTimeout(() => setScriptCopied(false), 2000)
}
const copyLink = () => {
const link = `${APP_URL}/share/${siteId}`
navigator.clipboard.writeText(link)
setLinkCopied(true)
toast.success('Link copied to clipboard')
setTimeout(() => setLinkCopied(false), 2000)
}
if (loading) {
return <LoadingOverlay logoSrc="/ciphera_icon_no_margins.png" title="Ciphera Analytics" />
}
@@ -275,21 +284,47 @@ export default function SiteSettingsPage() {
</div>
{formData.is_public && (
<div className="pt-4 border-t border-neutral-200 dark:border-neutral-800">
<label htmlFor="password" className="block text-sm font-medium mb-2 text-neutral-900 dark:text-white">
Password Protection (Optional)
</label>
<input
type="password"
id="password"
value={formData.password}
onChange={(e) => setFormData({ ...formData, password: e.target.value })}
placeholder="Leave empty to keep existing password (if any)"
className="w-full px-4 py-2 border border-neutral-300 dark:border-neutral-700 rounded-lg bg-white dark:bg-neutral-800 text-neutral-900 dark:text-white focus:ring-2 focus:ring-brand-orange focus:border-transparent"
/>
<p className="mt-1 text-xs text-neutral-500">
Set a password to restrict access to the public dashboard.
</p>
<div className="pt-4 border-t border-neutral-200 dark:border-neutral-800 space-y-4">
<div>
<label className="block text-sm font-medium mb-2 text-neutral-900 dark:text-white">
Public Link
</label>
<div className="flex gap-2">
<input
type="text"
readOnly
value={`${APP_URL}/share/${siteId}`}
className="flex-1 px-4 py-2 border border-neutral-300 dark:border-neutral-700 rounded-lg bg-neutral-100 dark:bg-neutral-800 text-neutral-600 dark:text-neutral-400 font-mono text-sm"
/>
<button
type="button"
onClick={copyLink}
className="btn-secondary whitespace-nowrap"
>
{linkCopied ? 'Copied!' : 'Copy Link'}
</button>
</div>
<p className="mt-1 text-xs text-neutral-500">
Share this link with others to view the dashboard.
</p>
</div>
<div>
<label htmlFor="password" className="block text-sm font-medium mb-2 text-neutral-900 dark:text-white">
Password Protection (Optional)
</label>
<input
type="password"
id="password"
value={formData.password}
onChange={(e) => setFormData({ ...formData, password: e.target.value })}
placeholder="Leave empty to keep existing password (if any)"
className="w-full px-4 py-2 border border-neutral-300 dark:border-neutral-700 rounded-lg bg-white dark:bg-neutral-800 text-neutral-900 dark:text-white focus:ring-2 focus:ring-brand-orange focus:border-transparent"
/>
<p className="mt-1 text-xs text-neutral-500">
Set a password to restrict access to the public dashboard.
</p>
</div>
</div>
)}
</div>