Function AddSpaceModal

apps/web/components/add-space-modal.tsx:85–356

({
	isOpen,
	onClose,
	onCreated,
}: {
	isOpen: boolean
	onClose: () => void
	onCreated?: (containerTag: string) => void
})

]

export function AddSpaceModal({
	isOpen,
	onClose,
	onCreated,
}: {
	isOpen: boolean
	onClose: () => void
	onCreated?: (containerTag: string) => void
}) {
	const [spaceName, setSpaceName] = useState("")
	const [spaceContext, setSpaceContext] = useState("")
	const [showContext, setShowContext] = useState(false)
	const [emoji, setEmoji] = useState("📁")
	const [isEmojiOpen, setIsEmojiOpen] = useState(false)
	const { createProjectMutation } = useProjectMutations()

	const handleClose = () => {
		onClose()
		setSpaceName("")
		setSpaceContext("")
		setShowContext(false)
		setEmoji("📁")
	}

	const handleCreate = () => {
		const trimmedName = spaceName.trim()
		if (!trimmedName) return

		createProjectMutation.mutate(
			{ name: trimmedName, emoji: emoji || undefined },
			{
				onSuccess: async (data) => {
					analytics.spaceCreated()
					const tag = data?.containerTag
					const context = showContext ? spaceContext.trim() : ""
					if (tag && context) {
						try {
							await $fetch(`@patch/container-tags/${tag}`, {
								body: { entityContext: context },
							})
						} catch {}
					}
					if (tag) onCreated?.(tag)
					handleClose()
				},
			},
		)
	}

	const handleKeyDown = (e: React.KeyboardEvent) => {
		if (
			e.key === "Enter" &&
			spaceName.trim() &&
			!createProjectMutation.isPending
		) {
			e.preventDefault()
			handleCreate()
		}