126 lines
4.4 KiB
Plaintext
126 lines
4.4 KiB
Plaintext
import { CustomIcon } from '@src/components/CustomIcon'
|
|
import { PATHS } from '@src/lib/paths'
|
|
import { useEffect } from 'react'
|
|
import { useLocation, useNavigate } from 'react-router-dom'
|
|
|
|
export function HicadProjectDashboardHeading({
|
|
projectCount,
|
|
}: {
|
|
projectCount: number
|
|
}) {
|
|
const location = useLocation()
|
|
const navigate = useNavigate()
|
|
const startCreatingProject = () => {
|
|
document
|
|
.querySelector<HTMLButtonElement>('[data-testid="home-new-file"]')
|
|
?.click()
|
|
}
|
|
const startFromSample = () => {
|
|
document
|
|
.querySelector<HTMLButtonElement>(
|
|
'[data-testid="home-create-from-sample"]'
|
|
)
|
|
?.click()
|
|
}
|
|
|
|
useEffect(() => {
|
|
const shouldCreateBlankProject =
|
|
new URLSearchParams(location.search).get('create') === 'blank'
|
|
if (!shouldCreateBlankProject) return
|
|
|
|
const timer = window.setTimeout(() => {
|
|
startCreatingProject()
|
|
void navigate(PATHS.HOME, { replace: true })
|
|
}, 250)
|
|
|
|
return () => window.clearTimeout(timer)
|
|
}, [location.search, navigate])
|
|
|
|
return (
|
|
<div
|
|
className="flex min-w-0 flex-1 flex-col gap-3 sm:flex-row sm:items-center sm:justify-between"
|
|
data-testid="hicad-project-dashboard-heading"
|
|
>
|
|
<div className="min-w-0">
|
|
<p className="mb-1 text-xs font-medium text-primary">HiCAD 项目空间</p>
|
|
<h1 className="text-3xl font-bold">我的 CAD 项目</h1>
|
|
<p className="mt-1 text-sm text-chalkboard-70 dark:text-chalkboard-30">
|
|
共 {projectCount} 个项目，编辑内容会自动保存
|
|
</p>
|
|
</div>
|
|
<div className="flex flex-none items-center gap-2">
|
|
<button
|
|
type="button"
|
|
onClick={startFromSample}
|
|
className="inline-flex h-10 items-center justify-center gap-2 rounded-sm border border-chalkboard-30 bg-chalkboard-10 px-3 text-sm font-medium text-chalkboard-90 transition-colors hover:border-primary/50 hover:bg-primary/5 dark:border-chalkboard-70 dark:bg-chalkboard-90 dark:text-chalkboard-20"
|
|
data-testid="hicad-create-from-sample"
|
|
>
|
|
<CustomIcon name="file" className="h-4 w-4" />
|
|
从示例开始
|
|
</button>
|
|
<button
|
|
type="button"
|
|
onClick={startCreatingProject}
|
|
className="inline-flex h-10 items-center justify-center gap-2 rounded-sm border border-primary bg-primary px-4 text-sm font-semibold text-white transition-colors hover:brightness-110 focus-visible:outline-appForeground"
|
|
data-testid="hicad-create-project"
|
|
>
|
|
<CustomIcon name="plus" className="h-5 w-5" />
|
|
新建项目
|
|
</button>
|
|
</div>
|
|
</div>
|
|
)
|
|
}
|
|
|
|
export function HicadAutosaveStatus() {
|
|
return (
|
|
<span
|
|
className="mr-1 inline-flex h-7 items-center gap-1.5 rounded-md border border-chalkboard-30 bg-chalkboard-10/80 px-2 text-xs text-chalkboard-70 dark:border-chalkboard-70 dark:bg-chalkboard-100/50 dark:text-chalkboard-30"
|
|
data-testid="hicad-autosave-status"
|
|
title="项目内容会自动保存到当前浏览器"
|
|
>
|
|
<span className="h-1.5 w-1.5 rounded-full bg-succeed-60" />
|
|
自动保存已开启
|
|
</span>
|
|
)
|
|
}
|
|
|
|
export function HicadEditorProjectActions({
|
|
onOpenProjectList,
|
|
onCreateBlankProject,
|
|
}: {
|
|
onOpenProjectList: () => void
|
|
onCreateBlankProject: () => void
|
|
}) {
|
|
const buttonClassName =
|
|
'inline-flex h-7 items-center justify-center gap-1.5 rounded-md border border-chalkboard-30 bg-chalkboard-10/80 px-2 text-xs font-medium text-chalkboard-80 transition-colors hover:border-primary/50 hover:bg-primary/5 hover:text-primary focus-visible:outline-appForeground dark:border-chalkboard-70 dark:bg-chalkboard-100/50 dark:text-chalkboard-30 dark:hover:border-primary/50 dark:hover:text-primary'
|
|
|
|
return (
|
|
<div
|
|
className="ml-2 flex flex-none items-center gap-1.5"
|
|
data-testid="hicad-editor-project-actions"
|
|
>
|
|
<a
|
|
href={`#${PATHS.HOME}`}
|
|
className={buttonClassName}
|
|
onClick={onOpenProjectList}
|
|
data-testid="hicad-open-project-list"
|
|
title="查看和打开历史项目"
|
|
>
|
|
<CustomIcon name="folder" className="h-4 w-4" />
|
|
项目列表
|
|
</a>
|
|
<a
|
|
href={`#${PATHS.HOME}?create=blank`}
|
|
className={buttonClassName}
|
|
onClick={onCreateBlankProject}
|
|
data-testid="hicad-create-blank-project"
|
|
title="新建空白 CAD 项目"
|
|
>
|
|
<CustomIcon name="plus" className="h-4 w-4" />
|
|
新建空白
|
|
</a>
|
|
</div>
|
|
)
|
|
}
|