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

chore: upgrade @ciphera-net/ui to v0.0.18 and refactor icon imports across components

Browse Source
This commit is contained in:
Usman Baig
2026-01-24 12:50:43 +01:00
parent 1c4ea35296
commit 5857a2ea15
10 changed files with 41 additions and 43 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
app/page.tsx
View File

@@ -6,7 +6,7 @@ import { initiateOAuthFlow, initiateSignupFlow } from '@/lib/api/oauth'
import { LoadingOverlay } from '@ciphera-net/ui' import { LoadingOverlay } from '@ciphera-net/ui'
import SiteList from '@/components/sites/SiteList' import SiteList from '@/components/sites/SiteList'
import { Button } from '@ciphera-net/ui' import { Button } from '@ciphera-net/ui'
import { BarChartIcon, LockClosedIcon, LightningBoltIcon } from '@radix-ui/react-icons' import { BarChartIcon, LockIcon, LightningIcon } from '@ciphera-net/ui'
export default function HomePage() { export default function HomePage() {
const { user, loading } = useAuth() const { user, loading } = useAuth()
@@ -58,7 +58,7 @@ export default function HomePage() {
<div className="grid md:grid-cols-3 gap-8 pt-16 text-left"> <div className="grid md:grid-cols-3 gap-8 pt-16 text-left">
<div className="p-6 rounded-xl bg-neutral-50 dark:bg-neutral-900 border border-neutral-200 dark:border-neutral-800"> <div className="p-6 rounded-xl bg-neutral-50 dark:bg-neutral-900 border border-neutral-200 dark:border-neutral-800">
<div className="w-12 h-12 bg-brand-orange/10 rounded-xl flex items-center justify-center mb-4 text-brand-orange"> <div className="w-12 h-12 bg-brand-orange/10 rounded-xl flex items-center justify-center mb-4 text-brand-orange">
<LockClosedIcon className="w-6 h-6" /> <LockIcon className="w-6 h-6" />
</div> </div>
<h3 className="text-xl font-bold text-neutral-900 dark:text-white mb-2">Privacy First</h3> <h3 className="text-xl font-bold text-neutral-900 dark:text-white mb-2">Privacy First</h3>
<p className="text-neutral-600 dark:text-neutral-400"> <p className="text-neutral-600 dark:text-neutral-400">
@@ -76,7 +76,7 @@ export default function HomePage() {
</div> </div>
<div className="p-6 rounded-xl bg-neutral-50 dark:bg-neutral-900 border border-neutral-200 dark:border-neutral-800"> <div className="p-6 rounded-xl bg-neutral-50 dark:bg-neutral-900 border border-neutral-200 dark:border-neutral-800">
<div className="w-12 h-12 bg-brand-orange/10 rounded-xl flex items-center justify-center mb-4 text-brand-orange"> <div className="w-12 h-12 bg-brand-orange/10 rounded-xl flex items-center justify-center mb-4 text-brand-orange">
<LightningBoltIcon className="w-6 h-6" /> <LightningIcon className="w-6 h-6" />
</div> </div>
<h3 className="text-xl font-bold text-neutral-900 dark:text-white mb-2">Lightweight</h3> <h3 className="text-xl font-bold text-neutral-900 dark:text-white mb-2">Lightweight</h3>
<p className="text-neutral-600 dark:text-neutral-400"> <p className="text-neutral-600 dark:text-neutral-400">

6
app/share/[id]/page.tsx
View File

@@ -12,7 +12,7 @@ import Locations from '@/components/dashboard/Locations'
import TechSpecs from '@/components/dashboard/TechSpecs' import TechSpecs from '@/components/dashboard/TechSpecs'
import PerformanceStats from '@/components/dashboard/PerformanceStats' import PerformanceStats from '@/components/dashboard/PerformanceStats'
import { Select, DatePicker as DatePickerModal } from '@ciphera-net/ui' import { Select, DatePicker as DatePickerModal } from '@ciphera-net/ui'
import { LightningBoltIcon } from '@radix-ui/react-icons' import { LightningIcon } from '@ciphera-net/ui'
// Helper to get date ranges // Helper to get date ranges
const getDateRange = (days: number) => { const getDateRange = (days: number) => {
@@ -105,7 +105,7 @@ export default function PublicDashboardPage() {
<div className="max-w-md w-full bg-white dark:bg-neutral-900 border border-neutral-200 dark:border-neutral-800 rounded-xl p-8 shadow-lg"> <div className="max-w-md w-full bg-white dark:bg-neutral-900 border border-neutral-200 dark:border-neutral-800 rounded-xl p-8 shadow-lg">
<div className="text-center mb-6"> <div className="text-center mb-6">
<div className="w-12 h-12 bg-brand-orange/10 rounded-xl flex items-center justify-center mx-auto mb-4 text-brand-orange"> <div className="w-12 h-12 bg-brand-orange/10 rounded-xl flex items-center justify-center mx-auto mb-4 text-brand-orange">
<LightningBoltIcon className="w-6 h-6" /> <LightningIcon className="w-6 h-6" />
</div> </div>
<h1 className="text-2xl font-bold text-neutral-900 dark:text-white mb-2"> <h1 className="text-2xl font-bold text-neutral-900 dark:text-white mb-2">
Protected Dashboard Protected Dashboard
@@ -254,7 +254,7 @@ export default function PublicDashboardPage() {
rel="noopener noreferrer" rel="noopener noreferrer"
className="hidden md:flex items-center gap-2 px-3 py-2 bg-white dark:bg-neutral-900 border border-neutral-200 dark:border-neutral-800 rounded-lg text-sm text-neutral-600 dark:text-neutral-400 hover:text-brand-orange dark:hover:text-brand-orange transition-colors" className="hidden md:flex items-center gap-2 px-3 py-2 bg-white dark:bg-neutral-900 border border-neutral-200 dark:border-neutral-800 rounded-lg text-sm text-neutral-600 dark:text-neutral-400 hover:text-brand-orange dark:hover:text-brand-orange transition-colors"
> >
<LightningBoltIcon className="w-4 h-4" /> <LightningIcon className="w-4 h-4" />
<span>Powered by Ciphera</span> <span>Powered by Ciphera</span>
</a> </a>
</div> </div>

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

@@ -13,14 +13,14 @@ import { generatePrivacySnippet } from '@/lib/utils/privacySnippet'
import { motion, AnimatePresence } from 'framer-motion' import { motion, AnimatePresence } from 'framer-motion'
import { useAuth } from '@/lib/auth/context' import { useAuth } from '@/lib/auth/context'
import { import {
GearIcon, SettingsIcon,
GlobeIcon, GlobeIcon,
FileTextIcon, FileTextIcon,
CheckIcon, CheckIcon,
CopyIcon, CopyIcon,
ExclamationTriangleIcon, AlertTriangleIcon,
LightningBoltIcon, LightningIcon,
} from '@radix-ui/react-icons' } from '@ciphera-net/ui'
const TIMEZONES = [ const TIMEZONES = [
'UTC', 'UTC',
@@ -236,7 +236,7 @@ export default function SiteSettingsPage() {
: 'text-neutral-600 dark:text-neutral-400 hover:bg-neutral-100 dark:hover:bg-neutral-800' : 'text-neutral-600 dark:text-neutral-400 hover:bg-neutral-100 dark:hover:bg-neutral-800'
}`} }`}
> >
<GearIcon className="w-5 h-5" /> <SettingsIcon className="w-5 h-5" />
General General
</button> </button>
<button <button
@@ -267,7 +267,7 @@ export default function SiteSettingsPage() {
<div className="flex-1 relative"> <div className="flex-1 relative">
{!canEdit && ( {!canEdit && (
<div className="mb-6 p-4 bg-amber-50 dark:bg-amber-900/10 text-amber-800 dark:text-amber-200 rounded-xl border border-amber-200 dark:border-amber-800 flex items-center gap-3"> <div className="mb-6 p-4 bg-amber-50 dark:bg-amber-900/10 text-amber-800 dark:text-amber-200 rounded-xl border border-amber-200 dark:border-amber-800 flex items-center gap-3">
<ExclamationTriangleIcon className="w-5 h-5" /> <AlertTriangleIcon className="w-5 h-5" />
<p className="text-sm font-medium">You have read-only access to this site. Contact an admin to make changes.</p> <p className="text-sm font-medium">You have read-only access to this site. Contact an admin to make changes.</p>
</div> </div>
)} )}
@@ -359,7 +359,7 @@ export default function SiteSettingsPage() {
onClick={() => setShowVerificationModal(true)} onClick={() => setShowVerificationModal(true)}
className="flex items-center gap-2 px-4 py-2 bg-white dark:bg-neutral-800 border border-neutral-200 dark:border-neutral-700 text-neutral-700 dark:text-neutral-300 rounded-xl hover:bg-neutral-50 dark:hover:bg-neutral-700 transition-all text-sm font-medium" className="flex items-center gap-2 px-4 py-2 bg-white dark:bg-neutral-800 border border-neutral-200 dark:border-neutral-700 text-neutral-700 dark:text-neutral-300 rounded-xl hover:bg-neutral-50 dark:hover:bg-neutral-700 transition-all text-sm font-medium"
> >
<LightningBoltIcon className="w-4 h-4" /> <LightningIcon className="w-4 h-4" />
Verify Installation Verify Installation
</button> </button>
<p className="text-xs text-neutral-500 dark:text-neutral-500"> <p className="text-xs text-neutral-500 dark:text-neutral-500">

6
components/dashboard/Chart.tsx
View File

@@ -14,7 +14,7 @@ import {
} from 'recharts' } from 'recharts'
import type { TooltipProps } from 'recharts' import type { TooltipProps } from 'recharts'
import { formatNumber, formatDuration } from '@/lib/utils/format' import { formatNumber, formatDuration } from '@/lib/utils/format'
import { ArrowTopRightIcon, ArrowBottomRightIcon, DownloadIcon, BarChartIcon } from '@radix-ui/react-icons' import { ArrowUpRightIcon, ArrowDownRightIcon, DownloadIcon, BarChartIcon } from '@ciphera-net/ui'
import { Button } from '@ciphera-net/ui' import { Button } from '@ciphera-net/ui'
import { Checkbox } from '@ciphera-net/ui' import { Checkbox } from '@ciphera-net/ui'
@@ -319,9 +319,9 @@ export default function Chart({ data, prevData, stats, prevStats, interval }: Ch
: 'text-neutral-500' : 'text-neutral-500'
}`}> }`}>
{(item.invertTrend ? -item.trend : item.trend) > 0 ? ( {(item.invertTrend ? -item.trend : item.trend) > 0 ? (
<ArrowTopRightIcon className="w-3 h-3 mr-0.5" /> <ArrowUpRightIcon className="w-3 h-3 mr-0.5" />
) : (item.invertTrend ? -item.trend : item.trend) < 0 ? ( ) : (item.invertTrend ? -item.trend : item.trend) < 0 ? (
<ArrowBottomRightIcon className="w-3 h-3 mr-0.5" /> <ArrowDownRightIcon className="w-3 h-3 mr-0.5" />
) : null} ) : null}
{Math.abs(item.trend)}% {Math.abs(item.trend)}%
</span> </span>

2
components/dashboard/PerformanceStats.tsx
View File

@@ -2,7 +2,7 @@
import { useState, useEffect } from 'react' import { useState, useEffect } from 'react'
import { motion } from 'framer-motion' import { motion } from 'framer-motion'
import { ChevronDownIcon } from '@radix-ui/react-icons' import { ChevronDownIcon } from '@ciphera-net/ui'
import { PerformanceStats as Stats, PerformanceByPageStat, getPerformanceByPage } from '@/lib/api/stats' import { PerformanceStats as Stats, PerformanceByPageStat, getPerformanceByPage } from '@/lib/api/stats'
import { Select } from '@ciphera-net/ui' import { Select } from '@ciphera-net/ui'

18
components/settings/OrganizationSettings.tsx
View File

@@ -19,14 +19,14 @@ import {
import { toast } from 'sonner' import { toast } from 'sonner'
import { motion, AnimatePresence } from 'framer-motion' import { motion, AnimatePresence } from 'framer-motion'
import { import {
ExclamationTriangleIcon, AlertTriangleIcon,
PlusIcon, PlusIcon,
CubeIcon, BoxIcon,
PersonIcon, UserIcon,
CheckIcon, CheckIcon,
Cross2Icon, XIcon,
CopyIcon CopyIcon
} from '@radix-ui/react-icons' } from '@ciphera-net/ui'
// @ts-ignore // @ts-ignore
import { Button, Input } from '@ciphera-net/ui' import { Button, Input } from '@ciphera-net/ui'
@@ -198,7 +198,7 @@ export default function OrganizationSettings() {
: 'text-neutral-600 dark:text-neutral-400 hover:bg-neutral-100 dark:hover:bg-neutral-800' : 'text-neutral-600 dark:text-neutral-400 hover:bg-neutral-100 dark:hover:bg-neutral-800'
}`} }`}
> >
<CubeIcon className="w-5 h-5" /> <BoxIcon className="w-5 h-5" />
General General
</button> </button>
<button <button
@@ -209,7 +209,7 @@ export default function OrganizationSettings() {
: 'text-neutral-600 dark:text-neutral-400 hover:bg-neutral-100 dark:hover:bg-neutral-800' : 'text-neutral-600 dark:text-neutral-400 hover:bg-neutral-100 dark:hover:bg-neutral-800'
}`} }`}
> >
<PersonIcon className="w-5 h-5" /> <UserIcon className="w-5 h-5" />
Members Members
</button> </button>
</nav> </nav>
@@ -462,7 +462,7 @@ export default function OrganizationSettings() {
<div className="flex justify-between items-center mb-4"> <div className="flex justify-between items-center mb-4">
<div className="flex items-center gap-3 text-red-600"> <div className="flex items-center gap-3 text-red-600">
<div className="h-10 w-10 rounded-full bg-red-100 dark:bg-red-900/30 flex items-center justify-center shrink-0"> <div className="h-10 w-10 rounded-full bg-red-100 dark:bg-red-900/30 flex items-center justify-center shrink-0">
<ExclamationTriangleIcon className="h-5 w-5" /> <AlertTriangleIcon className="h-5 w-5" />
</div> </div>
<h3 className="text-lg font-semibold">Delete Organization?</h3> <h3 className="text-lg font-semibold">Delete Organization?</h3>
</div> </div>
@@ -473,7 +473,7 @@ export default function OrganizationSettings() {
}} }}
className="text-neutral-500 hover:text-neutral-700 dark:text-neutral-400 dark:hover:text-white" className="text-neutral-500 hover:text-neutral-700 dark:text-neutral-400 dark:hover:text-white"
> >
<Cross2Icon className="w-5 h-5" /> <XIcon className="w-5 h-5" />
</button> </button>
</div> </div>

2
components/sites/SiteList.tsx
View File

@@ -6,7 +6,7 @@ import { listSites, deleteSite, type Site } from '@/lib/api/sites'
import { toast } from 'sonner' import { toast } from 'sonner'
import { LoadingOverlay } from '@ciphera-net/ui' import { LoadingOverlay } from '@ciphera-net/ui'
import { useAuth } from '@/lib/auth/context' import { useAuth } from '@/lib/auth/context'
import { BarChartIcon } from '@radix-ui/react-icons' import { BarChartIcon } from '@ciphera-net/ui'
export default function SiteList() { export default function SiteList() {
const { user } = useAuth() const { user } = useAuth()

18
components/sites/VerificationModal.tsx
View File

@@ -4,12 +4,12 @@ import { useState, useEffect } from 'react'
import { createPortal } from 'react-dom' import { createPortal } from 'react-dom'
import { motion, AnimatePresence } from 'framer-motion' import { motion, AnimatePresence } from 'framer-motion'
import { import {
Cross2Icon, XIcon,
ExternalLinkIcon, ExternalLinkIcon,
CheckCircledIcon, CheckCircleIcon,
ExclamationTriangleIcon, AlertTriangleIcon,
LightningBoltIcon LightningIcon
} from '@radix-ui/react-icons' } from '@ciphera-net/ui'
import { Site } from '@/lib/api/sites' import { Site } from '@/lib/api/sites'
import { getRealtime } from '@/lib/api/stats' import { getRealtime } from '@/lib/api/stats'
import { toast } from 'sonner' import { toast } from 'sonner'
@@ -111,7 +111,7 @@ export default function VerificationModal({ isOpen, onClose, site }: Verificatio
onClick={onClose} onClick={onClose}
className="p-1 rounded-lg text-neutral-500 hover:bg-neutral-100 dark:hover:bg-neutral-800 transition-colors" className="p-1 rounded-lg text-neutral-500 hover:bg-neutral-100 dark:hover:bg-neutral-800 transition-colors"
> >
<Cross2Icon className="w-5 h-5" /> <XIcon className="w-5 h-5" />
</button> </button>
</div> </div>
@@ -121,7 +121,7 @@ export default function VerificationModal({ isOpen, onClose, site }: Verificatio
<div className="space-y-4"> <div className="space-y-4">
<div className="p-4 rounded-xl bg-brand-orange/5 border border-brand-orange/10 flex gap-4"> <div className="p-4 rounded-xl bg-brand-orange/5 border border-brand-orange/10 flex gap-4">
<div className="p-2 bg-brand-orange/10 rounded-lg h-fit text-brand-orange"> <div className="p-2 bg-brand-orange/10 rounded-lg h-fit text-brand-orange">
<LightningBoltIcon className="w-5 h-5" /> <LightningIcon className="w-5 h-5" />
</div> </div>
<div className="space-y-1"> <div className="space-y-1">
<h4 className="font-medium text-brand-orange">How this works</h4> <h4 className="font-medium text-brand-orange">How this works</h4>
@@ -161,7 +161,7 @@ export default function VerificationModal({ isOpen, onClose, site }: Verificatio
{status === 'success' && ( {status === 'success' && (
<div className="flex flex-col items-center justify-center py-6 space-y-6"> <div className="flex flex-col items-center justify-center py-6 space-y-6">
<div className="w-16 h-16 bg-green-100 dark:bg-green-900/20 rounded-full flex items-center justify-center text-green-600 dark:text-green-400"> <div className="w-16 h-16 bg-green-100 dark:bg-green-900/20 rounded-full flex items-center justify-center text-green-600 dark:text-green-400">
<CheckCircledIcon className="w-8 h-8" /> <CheckCircleIcon className="w-8 h-8" />
</div> </div>
<div className="text-center space-y-1"> <div className="text-center space-y-1">
<h4 className="text-xl font-bold text-neutral-900 dark:text-white"> <h4 className="text-xl font-bold text-neutral-900 dark:text-white">
@@ -184,7 +184,7 @@ export default function VerificationModal({ isOpen, onClose, site }: Verificatio
<div className="space-y-6"> <div className="space-y-6">
<div className="flex flex-col items-center justify-center space-y-2 text-center"> <div className="flex flex-col items-center justify-center space-y-2 text-center">
<div className="w-12 h-12 bg-red-100 dark:bg-red-900/20 rounded-full flex items-center justify-center text-red-600 dark:text-red-400"> <div className="w-12 h-12 bg-red-100 dark:bg-red-900/20 rounded-full flex items-center justify-center text-red-600 dark:text-red-400">
<ExclamationTriangleIcon className="w-6 h-6" /> <AlertTriangleIcon className="w-6 h-6" />
</div> </div>
<h4 className="font-medium text-red-600 dark:text-red-400"> <h4 className="font-medium text-red-600 dark:text-red-400">
Connection Timed Out Connection Timed Out

9
package-lock.json generated
View File

@@ -8,8 +8,7 @@
"name": "pulse-frontend", "name": "pulse-frontend",
"version": "0.1.0", "version": "0.1.0",
"dependencies": { "dependencies": {
"@ciphera-net/ui": "^0.0.16", "@ciphera-net/ui": "^0.0.18",
"@radix-ui/react-icons": "^1.3.2",
"axios": "^1.13.2", "axios": "^1.13.2",
"country-flag-icons": "^1.6.4", "country-flag-icons": "^1.6.4",
"d3-scale": "^4.0.2", "d3-scale": "^4.0.2",
@@ -268,9 +267,9 @@
} }
}, },
"node_modules/@ciphera-net/ui": { "node_modules/@ciphera-net/ui": {
"version": "0.0.16", "version": "0.0.18",
"resolved": "https://npm.pkg.github.com/download/@ciphera-net/ui/0.0.16/896c89477d9a9907f3e1f3db950fcd84400ee64c", "resolved": "https://npm.pkg.github.com/download/@ciphera-net/ui/0.0.18/bc703f2d658a9ba28ad8cc6a9ff683a30b8f662f",
"integrity": "sha512-HYmyv9wUxggr+ZwpR+kSf+LtmEHuvrPxHVDOg9OxVuIppjExku1YdNbKbUgYFvcLbsHDqULGDfecrgsHoC1Rgg==", "integrity": "sha512-WMBWOx/7QHlZ7p2umIZRTA7iOB0PSgxBYyR52uHhE8tjR1jSSEzrFruth/azzwbLx8zi7DqIeeGSjxJpuRddDA==",
"dependencies": { "dependencies": {
"@radix-ui/react-icons": "^1.3.0", "@radix-ui/react-icons": "^1.3.0",
"clsx": "^2.1.0", "clsx": "^2.1.0",

3
package.json
View File

@@ -10,8 +10,7 @@
"type-check": "tsc --noEmit" "type-check": "tsc --noEmit"
}, },
"dependencies": { "dependencies": {
"@ciphera-net/ui": "^0.0.16", "@ciphera-net/ui": "^0.0.18",
"@radix-ui/react-icons": "^1.3.2",
"axios": "^1.13.2", "axios": "^1.13.2",
"country-flag-icons": "^1.6.4", "country-flag-icons": "^1.6.4",
"d3-scale": "^4.0.2", "d3-scale": "^4.0.2",