Remove mounted state check to fix hydration error

This commit is contained in:
2025-12-03 01:15:04 +00:00
parent 89e3ac22fb
commit ea8e770c57
2 changed files with 1 additions and 16 deletions

View File

@@ -162,7 +162,7 @@ export default function ListDetailView({
return ( return (
<div className="space-y-6"> <div className="space-y-6">
{/* Permission Badge and Share Button */} {/* Permission Badge and Share Button */}
{mounted && (permission || canShare) && ( {(permission || canShare) && (
<div className="flex items-center gap-2"> <div className="flex items-center gap-2">
{permission && <PermissionBadge permission={permission} />} {permission && <PermissionBadge permission={permission} />}
{canShare && ( {canShare && (

View File

@@ -1,7 +1,6 @@
'use client' 'use client'
import { Shield, Eye, Edit3 } from 'lucide-react' import { Shield, Eye, Edit3 } from 'lucide-react'
import { useEffect, useState } from 'react'
type Permission = 'owner' | 'editor' | 'viewer' type Permission = 'owner' | 'editor' | 'viewer'
@@ -11,12 +10,6 @@ interface PermissionBadgeProps {
} }
export default function PermissionBadge({ permission, size = 'md' }: PermissionBadgeProps) { export default function PermissionBadge({ permission, size = 'md' }: PermissionBadgeProps) {
const [mounted, setMounted] = useState(false)
useEffect(() => {
setMounted(true)
}, [])
const config = { const config = {
owner: { owner: {
icon: Shield, icon: Shield,
@@ -35,14 +28,6 @@ export default function PermissionBadge({ permission, size = 'md' }: PermissionB
}, },
} }
if (!mounted) {
return (
<span className={`inline-flex items-center gap-1.5 rounded-full border font-medium bg-gray-100 text-gray-700 border-gray-200 ${size === 'sm' ? 'text-xs px-2 py-1' : 'text-sm px-3 py-1.5'}`}>
Loading...
</span>
)
}
const { icon: Icon, label, className } = config[permission] const { icon: Icon, label, className } = config[permission]
const sizeClasses = size === 'sm' ? 'text-xs px-2 py-1' : 'text-sm px-3 py-1.5' const sizeClasses = size === 'sm' ? 'text-xs px-2 py-1' : 'text-sm px-3 py-1.5'
const iconSize = size === 'sm' ? 12 : 14 const iconSize = size === 'sm' ? 12 : 14