Skip to content

Commit 3677ec2

Browse files
djbarnwaldjbarnwal
authored
tweak: add canvas generation paths (#8582)
* update label copy * add canvas gen menu item to nav files * rearrange 3 dot menu options * consistent labels * update tests * review
1 parent e604da4 commit 3677ec2

File tree

14 files changed

+362
-127
lines changed

14 files changed

+362
-127
lines changed

‎web-common/src/features/canvas/CanvasMenuItems.svelte‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -30,5 +30,5 @@
3030

3131
<NavigationMenuItem on:click={viewGraph}>
3232
<GitBranch slot="icon" size="14px" />
33-
View dependency graph
33+
View DAG graph
3434
</NavigationMenuItem>

‎web-common/src/features/explores/ExploreMenuItems.svelte‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -30,5 +30,5 @@
3030

3131
<NavigationMenuItem on:click={viewGraph}>
3232
<GitBranch slot="icon" size="14px" />
33-
View dependency graph
33+
View DAG graph
3434
</NavigationMenuItem>

‎web-common/src/features/file-explorer/NavDirectoryEntry.svelte‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -122,7 +122,7 @@
122122
</NavigationMenuItem>
123123
<NavigationMenuItem on:click={() => onRename(dir.path, true)}>
124124
<EditIcon slot="icon" />
125-
Rename...
125+
Rename
126126
</NavigationMenuItem>
127127
<NavigationMenuItem on:click={() => onDelete(dir.path, true)}>
128128
<Cancel slot="icon" />

‎web-common/src/features/file-explorer/NavFile.svelte‎

Lines changed: 22 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -2,14 +2,17 @@
22
import { page } from "$app/stores";
33
import ContextButton from "@rilldata/web-common/components/button/ContextButton.svelte";
44
import * as DropdownMenu from "@rilldata/web-common/components/dropdown-menu/";
5-
import Cancel from "@rilldata/web-common/components/icons/Cancel.svelte";
5+
import Alert from "@rilldata/web-common/components/icons/Alert.svelte";
66
import EditIcon from "@rilldata/web-common/components/icons/EditIcon.svelte";
7+
import LoadingSpinner from "@rilldata/web-common/components/icons/LoadingSpinner.svelte";
78
import MoreHorizontal from "@rilldata/web-common/components/icons/MoreHorizontal.svelte";
9+
import Trash from "@rilldata/web-common/components/icons/Trash.svelte";
810
import { removeLeadingSlash } from "@rilldata/web-common/features/entity-management/entity-mappers";
911
import type { NavDragData } from "@rilldata/web-common/features/file-explorer/nav-entry-drag-drop-store";
1012
import { getPaddingFromPath } from "@rilldata/web-common/features/file-explorer/nav-tree-spacing";
1113
import { getScreenNameFromPage } from "@rilldata/web-common/features/file-explorer/telemetry";
1214
import NavigationMenuItem from "@rilldata/web-common/layout/navigation/NavigationMenuItem.svelte";
15+
import NavigationMenuSeparator from "@rilldata/web-common/layout/navigation/NavigationMenuSeparator.svelte";
1316
import { queryClient } from "@rilldata/web-common/lib/svelte-query/globalQueryClient";
1417
import { behaviourEvent } from "@rilldata/web-common/metrics/initMetrics";
1518
import { BehaviourEventMedium } from "@rilldata/web-common/metrics/service/BehaviourEventTypes";
@@ -24,21 +27,19 @@
2427
import type { Readable } from "svelte/store";
2528
import CopyIcon from "../../components/icons/CopyIcon.svelte";
2629
import File from "../../components/icons/File.svelte";
30+
import CanvasMenuItems from "../canvas/CanvasMenuItems.svelte";
2731
import { fileArtifacts } from "../entity-management/file-artifacts";
2832
import { getTopLevelFolder } from "../entity-management/file-path-utils";
2933
import {
3034
resourceColorMapping,
3135
resourceIconMapping,
3236
} from "../entity-management/resource-icon-mapping";
3337
import { ResourceKind } from "../entity-management/resource-selectors";
38+
import ExploreMenuItems from "../explores/ExploreMenuItems.svelte";
3439
import MetricsViewMenuItems from "../metrics-views/MetricsViewMenuItems.svelte";
3540
import ModelMenuItems from "../models/navigation/ModelMenuItems.svelte";
3641
import SourceMenuItems from "../sources/navigation/SourceMenuItems.svelte";
37-
import ExploreMenuItems from "../explores/ExploreMenuItems.svelte";
38-
import CanvasMenuItems from "../canvas/CanvasMenuItems.svelte";
3942
import { PROTECTED_DIRECTORIES, PROTECTED_FILES } from "./protected-paths";
40-
import Alert from "@rilldata/web-common/components/icons/Alert.svelte";
41-
import LoadingSpinner from "@rilldata/web-common/components/icons/LoadingSpinner.svelte";
4243
4344
export let filePath: string;
4445
export let onRename: (filePath: string, isDir: boolean) => void;
@@ -153,19 +154,6 @@
153154
side="right"
154155
sideOffset={16}
155156
>
156-
{#if resourceKind}
157-
{#if resourceKind === ResourceKind.Source}
158-
<SourceMenuItems {filePath} />
159-
{:else if resourceKind === ResourceKind.Model}
160-
<ModelMenuItems {filePath} />
161-
{:else if resourceKind === ResourceKind.MetricsView}
162-
<MetricsViewMenuItems {filePath} />
163-
{:else if resourceKind === ResourceKind.Explore}
164-
<ExploreMenuItems {filePath} />
165-
{:else if resourceKind === ResourceKind.Canvas}
166-
<CanvasMenuItems {filePath} />
167-
{/if}
168-
{/if}
169157
{#if $hasUnsavedChanges}
170158
<NavigationMenuItem on:click={saveLocalContent}>
171159
<Save slot="icon" size="12px" />
@@ -174,14 +162,28 @@
174162
{/if}
175163
<NavigationMenuItem on:click={() => onRename(filePath, false)}>
176164
<EditIcon slot="icon" />
177-
Rename...
165+
Rename
178166
</NavigationMenuItem>
179167
<NavigationMenuItem on:click={() => onDuplicate(filePath, false)}>
180168
<CopyIcon slot="icon" />
181169
Duplicate
182170
</NavigationMenuItem>
171+
{#if resourceKind}
172+
{#if resourceKind === ResourceKind.Source}
173+
<SourceMenuItems {filePath} />
174+
{:else if resourceKind === ResourceKind.Model}
175+
<ModelMenuItems {filePath} />
176+
{:else if resourceKind === ResourceKind.MetricsView}
177+
<MetricsViewMenuItems {filePath} />
178+
{:else if resourceKind === ResourceKind.Explore}
179+
<ExploreMenuItems {filePath} />
180+
{:else if resourceKind === ResourceKind.Canvas}
181+
<CanvasMenuItems {filePath} />
182+
{/if}
183+
{/if}
184+
<NavigationMenuSeparator />
183185
<NavigationMenuItem on:click={() => onDelete(filePath, false)}>
184-
<Cancel slot="icon" />
186+
<Trash slot="icon" />
185187
Delete
186188
</NavigationMenuItem>
187189
</DropdownMenu.Content>

‎web-common/src/features/metrics-views/GoToDashboardButton.svelte‎

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,7 @@
1818
1919
export let resource: V1Resource | undefined;
2020
21-
const { generateCanvas } = featureFlags;
21+
const { ai, generateCanvas } = featureFlags;
2222
2323
$: ({ instanceId } = $runtime);
2424
$: dashboardsQuery = useGetExploresForMetricsView(
@@ -42,7 +42,7 @@
4242
);
4343
}}
4444
>
45-
Create Canvas dashboard
45+
Generate Canvas Dashboard{$ai ? " with AI" : ""}
4646
</Button>
4747
{/if}
4848
<Button
@@ -53,7 +53,7 @@
5353
await createAndPreviewExplore(queryClient, instanceId, resource);
5454
}}
5555
>
56-
Create Explore dashboard
56+
Generate Explore Dashboard{$ai ? " with AI" : ""}
5757
</Button>
5858
</div>
5959
{:else}
@@ -87,7 +87,7 @@
8787
}}
8888
>
8989
<Add />
90-
Create Canvas dashboard
90+
Generate Canvas Dashboard{$ai ? " with AI" : ""}
9191
</DropdownMenu.Item>
9292
{/if}
9393
<DropdownMenu.Item
@@ -97,7 +97,7 @@
9797
}}
9898
>
9999
<Add />
100-
Create Explore dashboard
100+
Generate Explore Dashboard{$ai ? " with AI" : ""}
101101
</DropdownMenu.Item>
102102
</DropdownMenu.Group>
103103
</DropdownMenu.Content>

‎web-common/src/features/metrics-views/MetricsViewMenuItems.svelte‎

Lines changed: 47 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -1,23 +1,27 @@
11
<script lang="ts">
22
import { goto } from "$app/navigation";
3+
import CanvasIcon from "@rilldata/web-common/components/icons/CanvasIcon.svelte";
34
import ExploreIcon from "@rilldata/web-common/components/icons/ExploreIcon.svelte";
45
import Model from "@rilldata/web-common/components/icons/Model.svelte";
56
import { fileArtifacts } from "@rilldata/web-common/features/entity-management/file-artifacts";
67
import { ResourceKind } from "@rilldata/web-common/features/entity-management/resource-selectors";
8+
import { featureFlags } from "@rilldata/web-common/features/feature-flags";
79
import { getScreenNameFromPage } from "@rilldata/web-common/features/file-explorer/telemetry";
10+
import { openResourceGraphQuickView } from "@rilldata/web-common/features/resource-graph/quick-view/quick-view-store";
811
import NavigationMenuItem from "@rilldata/web-common/layout/navigation/NavigationMenuItem.svelte";
9-
import NavigationMenuSeparator from "@rilldata/web-common/layout/navigation/NavigationMenuSeparator.svelte";
12+
import { queryClient } from "@rilldata/web-common/lib/svelte-query/globalQueryClient";
1013
import { behaviourEvent } from "@rilldata/web-common/metrics/initMetrics";
1114
import { BehaviourEventMedium } from "@rilldata/web-common/metrics/service/BehaviourEventTypes";
1215
import {
1316
MetricsEventScreenName,
1417
MetricsEventSpace,
1518
} from "@rilldata/web-common/metrics/service/MetricsTypes";
1619
import { runtime } from "@rilldata/web-common/runtime-client/runtime-store";
17-
import { queryClient } from "@rilldata/web-common/lib/svelte-query/globalQueryClient";
20+
import { GitBranch, WandIcon } from "lucide-svelte";
21+
import { createCanvasDashboardFromMetricsView } from "./ai-generation/generateMetricsView";
1822
import { createAndPreviewExplore } from "./create-and-preview-explore";
19-
import { GitBranch } from "lucide-svelte";
20-
import { openResourceGraphQuickView } from "@rilldata/web-common/features/resource-graph/quick-view/quick-view-store";
23+
24+
const { ai, generateCanvas } = featureFlags;
2125
2226
export let filePath: string;
2327
@@ -38,6 +42,8 @@
3842
3943
$: hasMenuItems = Boolean(referenceModelName || resource);
4044
45+
$: metricsViewName = resource?.meta?.name?.name;
46+
4147
const editModel = async () => {
4248
if (!referenceModelName) return;
4349
const artifact = fileArtifacts.findFileArtifact(
@@ -65,13 +71,37 @@
6571
}
6672
openResourceGraphQuickView(resource);
6773
}
74+
75+
async function handleCreateCanvasDashboard() {
76+
if (!metricsViewName) return;
77+
await createCanvasDashboardFromMetricsView(instanceId, metricsViewName);
78+
}
6879
</script>
6980

7081
{#if hasMenuItems}
7182
{#if referenceModelName}
7283
<NavigationMenuItem on:click={editModel}>
7384
<Model slot="icon" />
74-
Edit model
85+
Edit underlying model
86+
</NavigationMenuItem>
87+
{/if}
88+
<NavigationMenuItem on:click={viewGraph}>
89+
<GitBranch slot="icon" size="14px" />
90+
View DAG graph
91+
</NavigationMenuItem>
92+
{#if resource && $generateCanvas}
93+
<NavigationMenuItem
94+
disabled={!metricsViewName}
95+
on:click={handleCreateCanvasDashboard}
96+
>
97+
<CanvasIcon slot="icon" />
98+
<div class="flex gap-x-2 items-center">
99+
Generate Canvas Dashboard
100+
{#if $ai}
101+
with AI
102+
<WandIcon class="w-3 h-3" />
103+
{/if}
104+
</div>
75105
</NavigationMenuItem>
76106
{/if}
77107
{#if resource}
@@ -80,13 +110,18 @@
80110
createAndPreviewExplore(queryClient, instanceId, resource)}
81111
>
82112
<ExploreIcon slot="icon" />
83-
Generate dashboard
113+
<div class="flex gap-x-2 items-center">
114+
Generate Explore Dashboard
115+
{#if $ai}
116+
with AI
117+
<WandIcon class="w-3 h-3" />
118+
{/if}
119+
</div>
84120
</NavigationMenuItem>
85121
{/if}
86-
<NavigationMenuSeparator />
122+
{:else}
123+
<NavigationMenuItem on:click={viewGraph}>
124+
<GitBranch slot="icon" size="14px" />
125+
View DAG graph
126+
</NavigationMenuItem>
87127
{/if}
88-
89-
<NavigationMenuItem on:click={viewGraph}>
90-
<GitBranch slot="icon" size="14px" />
91-
View dependency graph
92-
</NavigationMenuItem>

0 commit comments

Comments
 (0)