Rebase and fmt and tsc

This commit is contained in:
49lf
2024-08-01 15:38:57 -04:00
parent a95f7c3f9c
commit c46bd02207
3 changed files with 5 additions and 108 deletions

View File

@ -86,7 +86,7 @@ export function ModelingSidebar({ paneOpacity }: ModelingSidebarProps) {
).filter( ).filter(
(pane) => (pane) =>
!pane.hideOnPlatform || !pane.hideOnPlatform ||
(isTauri() (isDesktop()
? pane.hideOnPlatform === 'web' ? pane.hideOnPlatform === 'web'
: pane.hideOnPlatform === 'desktop') : pane.hideOnPlatform === 'desktop')
), ),
@ -142,110 +142,7 @@ export function ModelingSidebar({ paneOpacity }: ModelingSidebarProps) {
}} }}
> >
<div id="app-sidebar" className={styles.grid + ' flex-1'}> <div id="app-sidebar" className={styles.grid + ' flex-1'}>
<ModelingSidebarSection id="sidebar-top" panes={topPanes} /> <ul
<ModelingSidebarSection
id="sidebar-bottom"
panes={bottomPanes}
alignButtons="end"
/>
</div>
</Resizable>
)
}
interface ModelingSidebarSectionProps extends HTMLAttributes<HTMLDivElement> {
panes: SidebarPane[]
alignButtons?: 'start' | 'end'
}
function ModelingSidebarSection({
panes,
alignButtons = 'start',
className,
...props
}: ModelingSidebarSectionProps) {
const { settings } = useSettingsAuthContext()
const showDebugPanel = settings.context.modeling.showDebugPanel
const paneIds = panes.map((pane) => pane.id)
const { send, context } = useModelingContext()
const foundOpenPane = context.store?.openPanes.find((pane) =>
paneIds.includes(pane)
)
const [currentPane, setCurrentPane] = useState(
foundOpenPane || ('none' as SidebarType | 'none')
)
const togglePane = useCallback(
(newPane: SidebarType | 'none') => {
if (newPane === 'none') {
send({
type: 'Set context',
data: {
openPanes: context.store?.openPanes.filter(
(p) => p !== currentPane
),
},
})
setCurrentPane('none')
} else if (newPane === currentPane) {
setCurrentPane('none')
send({
type: 'Set context',
data: {
openPanes: context.store?.openPanes.filter((p) => p !== newPane),
},
})
} else {
send({
type: 'Set context',
data: {
openPanes: [
...context.store?.openPanes.filter((p) => p !== currentPane),
newPane,
],
},
})
setCurrentPane(newPane)
}
},
[context.store?.openPanes, send, currentPane, setCurrentPane]
)
// Filter out the debug panel if it's not supposed to be shown
// TODO: abstract out for allowing user to configure which panes to show
const filteredPanes = (
showDebugPanel.current ? panes : panes.filter((pane) => pane.id !== 'debug')
).filter(
(pane) =>
!pane.hideOnPlatform ||
(isDesktop()
? pane.hideOnPlatform === 'web'
: pane.hideOnPlatform === 'desktop')
)
useEffect(() => {
if (
!showDebugPanel.current &&
currentPane === 'debug' &&
context.store?.openPanes.includes('debug')
) {
togglePane('debug')
}
}, [showDebugPanel.current, togglePane, context.store?.openPanes])
return (
<div className={'group contents ' + className} {...props}>
<Tab.Group
vertical
selectedIndex={
currentPane === 'none' ? 0 : paneIds.indexOf(currentPane) + 1
}
onChange={(index) => {
const newPane = index === 0 ? 'none' : paneIds[index - 1]
togglePane(newPane)
}}
>
<Tab.List
id={`${props.id}-ribbon`}
className={ className={
(context.store?.openPanes.length === 0 ? 'rounded-r ' : '') + (context.store?.openPanes.length === 0 ? 'rounded-r ' : '') +
'relative z-[2] pointer-events-auto p-0 col-start-1 col-span-1 h-fit w-fit flex flex-col ' + 'relative z-[2] pointer-events-auto p-0 col-start-1 col-span-1 h-fit w-fit flex flex-col ' +

View File

@ -45,7 +45,7 @@ function OnboardingResetWarning(props: OnboardingResetWarningProps) {
return ( return (
<div className="fixed inset-0 z-50 grid place-content-center bg-chalkboard-110/50"> <div className="fixed inset-0 z-50 grid place-content-center bg-chalkboard-110/50">
<div className="max-w-3xl p-8 rounded bg-chalkboard-10 dark:bg-chalkboard-90"> <div className="max-w-3xl p-8 rounded bg-chalkboard-10 dark:bg-chalkboard-90">
{!isTauri() ? ( {!isDesktop() ? (
<OnboardingWarningWeb {...props} /> <OnboardingWarningWeb {...props} />
) : ( ) : (
<OnboardingWarningDesktop {...props} /> <OnboardingWarningDesktop {...props} />

View File

@ -20,8 +20,8 @@ export default function ProjectMenu() {
<section className="flex-1"> <section className="flex-1">
<h2 className="text-2xl font-bold">Project Menu</h2> <h2 className="text-2xl font-bold">Project Menu</h2>
<p className="my-4"> <p className="my-4">
Click on {onDesktop ? `your part's name` : `the app name`} in the upper Click on {onDesktop ? `your part's name` : `the app name`} in the
left to open the project menu, where you can open the project upper left to open the project menu, where you can open the project
settings and export your current part. settings and export your current part.
{onDesktop && ( {onDesktop && (
<> You can click the Zoo logo to quickly navigate home.</> <> You can click the Zoo logo to quickly navigate home.</>