feat: gate custom step creation tab by permission
Viewers who cannot create steps will only see the "Browse Library" tab in the CustomStepModal, hiding the "Type My Own" creation form. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -1,6 +1,7 @@
|
||||
import { useState } from 'react'
|
||||
import { X } from 'lucide-react'
|
||||
import { cn } from '@/lib/utils'
|
||||
import { usePermissions } from '@/hooks/usePermissions'
|
||||
import { StepForm } from './StepForm'
|
||||
import { StepLibraryBrowser } from './StepLibraryBrowser'
|
||||
import type { Step, StepCreate } from '@/types/step'
|
||||
@@ -30,7 +31,8 @@ interface CustomStepModalProps {
|
||||
type Tab = 'create' | 'browse'
|
||||
|
||||
export function CustomStepModal({ isOpen, onClose, onInsertStep }: CustomStepModalProps) {
|
||||
const [activeTab, setActiveTab] = useState<Tab>('create')
|
||||
const { canCreateSteps } = usePermissions()
|
||||
const [activeTab, setActiveTab] = useState<Tab>(canCreateSteps ? 'create' : 'browse')
|
||||
const [isSubmitting, setIsSubmitting] = useState(false)
|
||||
const [error, setError] = useState<string | null>(null)
|
||||
|
||||
@@ -78,17 +80,19 @@ export function CustomStepModal({ isOpen, onClose, onInsertStep }: CustomStepMod
|
||||
|
||||
{/* Tabs */}
|
||||
<div className="flex border-b border-border">
|
||||
<button
|
||||
onClick={() => setActiveTab('create')}
|
||||
className={cn(
|
||||
'flex-1 px-4 py-3 text-sm font-medium transition-colors',
|
||||
activeTab === 'create'
|
||||
? 'border-b-2 border-primary bg-primary/5 text-primary'
|
||||
: 'text-muted-foreground hover:bg-muted/50 hover:text-foreground'
|
||||
)}
|
||||
>
|
||||
Type My Own
|
||||
</button>
|
||||
{canCreateSteps && (
|
||||
<button
|
||||
onClick={() => setActiveTab('create')}
|
||||
className={cn(
|
||||
'flex-1 px-4 py-3 text-sm font-medium transition-colors',
|
||||
activeTab === 'create'
|
||||
? 'border-b-2 border-primary bg-primary/5 text-primary'
|
||||
: 'text-muted-foreground hover:bg-muted/50 hover:text-foreground'
|
||||
)}
|
||||
>
|
||||
Type My Own
|
||||
</button>
|
||||
)}
|
||||
<button
|
||||
onClick={() => setActiveTab('browse')}
|
||||
className={cn(
|
||||
|
||||
Reference in New Issue
Block a user