Fix modal titles, hover rounding, search focus, and page filter dimension
- Remove redundant prefixes from modal titles - Remove -mx-2 from modal rows so hover rounds evenly on both sides - Fix page filter using wrong dimension name (path -> page) - Bump @ciphera-net/ui to 0.1.3 (fixes search input losing focus) Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -213,7 +213,7 @@ export default function Campaigns({ siteId, dateRange, filters, onFilter }: Camp
|
||||
<Modal
|
||||
isOpen={isModalOpen}
|
||||
onClose={() => { setIsModalOpen(false); setModalSearch('') }}
|
||||
title="All Campaigns"
|
||||
title="Campaigns"
|
||||
className="max-w-2xl"
|
||||
>
|
||||
<div>
|
||||
@@ -250,7 +250,7 @@ export default function Campaigns({ siteId, dateRange, filters, onFilter }: Camp
|
||||
<div
|
||||
key={`${item.source}|${item.medium}|${item.campaign}`}
|
||||
onClick={() => { if (onFilter) { onFilter({ dimension: 'utm_source', operator: 'is', values: [item.source] }); setIsModalOpen(false) } }}
|
||||
className={`flex items-center justify-between py-2 group hover:bg-neutral-50 dark:hover:bg-neutral-800 rounded-lg px-2 -mx-2 transition-colors${onFilter ? ' cursor-pointer' : ''}`}
|
||||
className={`flex items-center justify-between py-2 group hover:bg-neutral-50 dark:hover:bg-neutral-800 rounded-lg px-2 transition-colors${onFilter ? ' cursor-pointer' : ''}`}
|
||||
>
|
||||
<div className="flex-1 flex items-center gap-3 min-w-0">
|
||||
{renderSourceIcon(item.source)}
|
||||
|
||||
@@ -197,7 +197,7 @@ export default function ContentStats({ topPages, entryPages, exitPages, domain,
|
||||
<Modal
|
||||
isOpen={isModalOpen}
|
||||
onClose={() => { setIsModalOpen(false); setModalSearch('') }}
|
||||
title={`Pages - ${getTabLabel(activeTab)}`}
|
||||
title={getTabLabel(activeTab)}
|
||||
className="max-w-2xl"
|
||||
>
|
||||
<div>
|
||||
@@ -222,8 +222,8 @@ export default function ContentStats({ topPages, entryPages, exitPages, domain,
|
||||
return (
|
||||
<div
|
||||
key={page.path}
|
||||
onClick={() => { if (canFilter) { onFilter({ dimension: 'path', operator: 'is', values: [page.path] }); setIsModalOpen(false) } }}
|
||||
className={`flex items-center justify-between h-9 group hover:bg-neutral-50 dark:hover:bg-neutral-800 rounded-lg px-2 -mx-2 transition-colors${canFilter ? ' cursor-pointer' : ''}`}
|
||||
onClick={() => { if (canFilter) { onFilter({ dimension: 'page', operator: 'is', values: [page.path] }); setIsModalOpen(false) } }}
|
||||
className={`flex items-center justify-between h-9 group hover:bg-neutral-50 dark:hover:bg-neutral-800 rounded-lg px-2 transition-colors${canFilter ? ' cursor-pointer' : ''}`}
|
||||
>
|
||||
<div className="flex-1 truncate text-neutral-900 dark:text-white flex items-center">
|
||||
<span className="truncate">{page.path}</span>
|
||||
|
||||
@@ -322,7 +322,7 @@ export default function Locations({ countries, cities, regions, geoDataLevel = '
|
||||
<Modal
|
||||
isOpen={isModalOpen}
|
||||
onClose={() => { setIsModalOpen(false); setModalSearch('') }}
|
||||
title={`Locations - ${activeTab.charAt(0).toUpperCase() + activeTab.slice(1)}`}
|
||||
title={activeTab.charAt(0).toUpperCase() + activeTab.slice(1)}
|
||||
className="max-w-2xl"
|
||||
>
|
||||
<div>
|
||||
@@ -355,7 +355,7 @@ export default function Locations({ countries, cities, regions, geoDataLevel = '
|
||||
<div
|
||||
key={`${item.country ?? ''}-${item.region ?? ''}-${item.city ?? ''}`}
|
||||
onClick={() => { if (canFilter) { onFilter({ dimension: dim, operator: 'is', values: [filterValue!] }); setIsModalOpen(false) } }}
|
||||
className={`flex items-center justify-between h-9 group hover:bg-neutral-50 dark:hover:bg-neutral-800 rounded-lg px-2 -mx-2 transition-colors${canFilter ? ' cursor-pointer' : ''}`}
|
||||
className={`flex items-center justify-between h-9 group hover:bg-neutral-50 dark:hover:bg-neutral-800 rounded-lg px-2 transition-colors${canFilter ? ' cursor-pointer' : ''}`}
|
||||
>
|
||||
<div className="flex-1 truncate text-neutral-900 dark:text-white flex items-center gap-3">
|
||||
<span className="shrink-0">{getFlagComponent(item.country ?? '')}</span>
|
||||
|
||||
@@ -223,7 +223,7 @@ export default function TechSpecs({ browsers, os, devices, screenResolutions, co
|
||||
<Modal
|
||||
isOpen={isModalOpen}
|
||||
onClose={() => { setIsModalOpen(false); setModalSearch('') }}
|
||||
title={`Technology - ${activeTab.charAt(0).toUpperCase() + activeTab.slice(1)}`}
|
||||
title={activeTab.charAt(0).toUpperCase() + activeTab.slice(1)}
|
||||
className="max-w-2xl"
|
||||
>
|
||||
<div>
|
||||
@@ -250,7 +250,7 @@ export default function TechSpecs({ browsers, os, devices, screenResolutions, co
|
||||
<div
|
||||
key={item.name}
|
||||
onClick={() => { if (canFilter) { onFilter({ dimension: dim, operator: 'is', values: [item.name] }); setIsModalOpen(false) } }}
|
||||
className={`flex items-center justify-between h-9 group hover:bg-neutral-50 dark:hover:bg-neutral-800 rounded-lg px-2 -mx-2 transition-colors${canFilter ? ' cursor-pointer' : ''}`}
|
||||
className={`flex items-center justify-between h-9 group hover:bg-neutral-50 dark:hover:bg-neutral-800 rounded-lg px-2 transition-colors${canFilter ? ' cursor-pointer' : ''}`}
|
||||
>
|
||||
<div className="flex-1 truncate text-neutral-900 dark:text-white flex items-center gap-3">
|
||||
{item.icon && <span className="text-lg">{item.icon}</span>}
|
||||
|
||||
@@ -177,7 +177,7 @@ export default function TopReferrers({ referrers, collectReferrers = true, siteI
|
||||
<div
|
||||
key={ref.referrer}
|
||||
onClick={() => { if (onFilter) { onFilter({ dimension: 'referrer', operator: 'is', values: [ref.referrer] }); setIsModalOpen(false) } }}
|
||||
className={`flex items-center justify-between h-9 group hover:bg-neutral-50 dark:hover:bg-neutral-800 rounded-lg px-2 -mx-2 transition-colors${onFilter ? ' cursor-pointer' : ''}`}
|
||||
className={`flex items-center justify-between h-9 group hover:bg-neutral-50 dark:hover:bg-neutral-800 rounded-lg px-2 transition-colors${onFilter ? ' cursor-pointer' : ''}`}
|
||||
>
|
||||
<div className="flex-1 truncate text-neutral-900 dark:text-white flex items-center gap-3">
|
||||
{renderReferrerIcon(ref.referrer)}
|
||||
|
||||
8
package-lock.json
generated
8
package-lock.json
generated
@@ -8,7 +8,7 @@
|
||||
"name": "pulse-frontend",
|
||||
"version": "0.13.0-alpha",
|
||||
"dependencies": {
|
||||
"@ciphera-net/ui": "^0.1.2",
|
||||
"@ciphera-net/ui": "^0.1.3",
|
||||
"@ducanh2912/next-pwa": "^10.2.9",
|
||||
"@phosphor-icons/react": "^2.1.10",
|
||||
"@simplewebauthn/browser": "^13.2.2",
|
||||
@@ -1666,9 +1666,9 @@
|
||||
}
|
||||
},
|
||||
"node_modules/@ciphera-net/ui": {
|
||||
"version": "0.1.2",
|
||||
"resolved": "https://npm.pkg.github.com/download/@ciphera-net/ui/0.1.2/3c7b059065be5a3f4bda0aeab66be342433eefcd",
|
||||
"integrity": "sha512-e8Iir4CPNJI1RP2pIzh41qLv6Ftig7c+b9OriI2Y+15g2GoaQjFzxzBFo+nyJuCj2QdvtHbkx8YpN+SLfnkPwA==",
|
||||
"version": "0.1.3",
|
||||
"resolved": "https://npm.pkg.github.com/download/@ciphera-net/ui/0.1.3/2fb3a50f2648b9206d662d2dfdeb1aed4a0e27af",
|
||||
"integrity": "sha512-JPM2XvErK6iW7XEJ81jEc2wqF4/Ej9o33f1xTc4MkzdMX5H81kLkUpp9TrwL/m6LvZ85Baj3853osnOvm8Y1Hw==",
|
||||
"dependencies": {
|
||||
"@phosphor-icons/react": "^2.1.10",
|
||||
"class-variance-authority": "^0.7.1",
|
||||
|
||||
@@ -12,7 +12,7 @@
|
||||
"test:watch": "vitest"
|
||||
},
|
||||
"dependencies": {
|
||||
"@ciphera-net/ui": "^0.1.2",
|
||||
"@ciphera-net/ui": "^0.1.3",
|
||||
"@ducanh2912/next-pwa": "^10.2.9",
|
||||
"@phosphor-icons/react": "^2.1.10",
|
||||
"@simplewebauthn/browser": "^13.2.2",
|
||||
|
||||
Reference in New Issue
Block a user