49 lines
1.7 KiB
Svelte
49 lines
1.7 KiB
Svelte
<script lang="ts">
|
|
import { getProjectWorkspace, workbenchProjects } from './mockData';
|
|
import ChannelContent from './ChannelContent.svelte';
|
|
import ObjectInspector from './ObjectInspector.svelte';
|
|
import ProjectRail from './ProjectRail.svelte';
|
|
import ProjectChannelSidebar from './ProjectChannelSidebar.svelte';
|
|
import WorkspaceTopbar from './WorkspaceTopbar.svelte';
|
|
import type { InspectorItem } from './types';
|
|
|
|
export let currentUser: { account: string };
|
|
|
|
let selectedProjectID = workbenchProjects[0].id;
|
|
let selectedItem: InspectorItem | null = null;
|
|
$: workspace = getProjectWorkspace(selectedProjectID);
|
|
$: selectedChannelID = workspace.channels[0].id;
|
|
$: selectedChannel = workspace.channels.find((channel) => channel.id === selectedChannelID) ?? workspace.channels[0];
|
|
|
|
function selectProject(projectID: number) {
|
|
selectedProjectID = projectID;
|
|
}
|
|
|
|
function selectChannel(channelID: string) {
|
|
selectedChannelID = channelID;
|
|
}
|
|
|
|
function inspectItem(item: InspectorItem) {
|
|
selectedItem = item;
|
|
}
|
|
</script>
|
|
|
|
<main class="workbench-shell">
|
|
<WorkspaceTopbar account={currentUser.account} />
|
|
<div class="workbench-body">
|
|
<ProjectRail projects={workbenchProjects} {selectedProjectID} onSelectProject={selectProject} />
|
|
<ProjectChannelSidebar
|
|
project={workspace.project}
|
|
channels={workspace.channels}
|
|
{selectedChannelID}
|
|
tags={workspace.tags}
|
|
recentSessions={workspace.recentSessions}
|
|
onSelectChannel={selectChannel}
|
|
/>
|
|
<section class="channel-stage" aria-label="Channel content">
|
|
<ChannelContent {workspace} channel={selectedChannel} onInspect={inspectItem} />
|
|
</section>
|
|
<ObjectInspector item={selectedItem} />
|
|
</div>
|
|
</main>
|