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: '' excluded_paths: ''
}) })
const [scriptCopied, setScriptCopied] = useState(false) const [scriptCopied, setScriptCopied] = useState(false)
const [linkCopied, setLinkCopied] = useState(false)
useEffect(() => { useEffect(() => {
loadSite() loadSite()
@@ -127,6 +128,14 @@ export default function SiteSettingsPage() {
setTimeout(() => setScriptCopied(false), 2000) 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) { if (loading) {
return <LoadingOverlay logoSrc="/ciphera_icon_no_margins.png" title="Ciphera Analytics" /> return <LoadingOverlay logoSrc="/ciphera_icon_no_margins.png" title="Ciphera Analytics" />
} }
@@ -275,21 +284,47 @@ export default function SiteSettingsPage() {
</div> </div>
{formData.is_public && ( {formData.is_public && (
<div className="pt-4 border-t border-neutral-200 dark:border-neutral-800"> <div className="pt-4 border-t border-neutral-200 dark:border-neutral-800 space-y-4">
<label htmlFor="password" className="block text-sm font-medium mb-2 text-neutral-900 dark:text-white"> <div>
Password Protection (Optional) <label className="block text-sm font-medium mb-2 text-neutral-900 dark:text-white">
</label> Public Link
<input </label>
type="password" <div className="flex gap-2">
id="password" <input
value={formData.password} type="text"
onChange={(e) => setFormData({ ...formData, password: e.target.value })} readOnly
placeholder="Leave empty to keep existing password (if any)" value={`${APP_URL}/share/${siteId}`}
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" 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"
/> />
<p className="mt-1 text-xs text-neutral-500"> <button
Set a password to restrict access to the public dashboard. type="button"
</p> 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>
)} )}
</div> </div>