Skip to content
This repository was archived by the owner on Feb 6, 2026. It is now read-only.

Commit ee467b6

Browse files
si-bors-ng[bot]britmyerss
si-bors-ng[bot]
and
britmyerss
authored
merge: #3475
3475: Reimplement attributes view for component debug screen r=britmyerss a=britmyerss This PR brings back the Debug view in the Attribute Panel, with some cleanups along the way: - Created `debug` modules for the various Node types on the graph: Socket, Attribute Prototype, Attribute Value, Component - Moved logic out of SDF and into the DAL - Moved the debug components into a Debug folder in app/web - Fixed up the interfaces a bit there for this data - Created a `AttributeValuePath` struct to consolidate path creation for attribute values for props and sockets (including the key/index for child attribute values of maps/arrays) - Includes input/output socket and attribute value debug data! - One realllllllllly basic integration test, but this should be expanded Co-authored-by: Brit Myers <brit@systeminit.com>
2 parents d283252 + 475c755 commit ee467b6

25 files changed

Lines changed: 1185 additions & 759 deletions

File tree

‎app/web/src/components/ComponentDetails.vue‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -190,7 +190,7 @@ import { ComponentType } from "@/components/ModelingDiagram/diagram_types";
190190
import ComponentCard from "./ComponentCard.vue";
191191
import DetailsPanelTimestamps from "./DetailsPanelTimestamps.vue";
192192
import ComponentDetailsResource from "./ComponentDetailsResource.vue";
193-
import ComponentDebugDetails from "./ComponentDebugDetails.vue";
193+
import ComponentDebugDetails from "./Debug/ComponentDebugDetails.vue";
194194
import AssetQualificationsDetails from "./AssetQualificationsDetails.vue";
195195
import AssetActionsDetails from "./AssetActionsDetails.vue";
196196
import SidebarSubpanelTitle from "./SidebarSubpanelTitle.vue";

app/web/src/components/AttributeDebugView.vue renamed to app/web/src/components/Debug/AttributeDebugView.vue

Lines changed: 5 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
<template>
22
<div class="overflow-hidden my-xs p-xs border-opacity-10 border-l-2">
33
<dl class="flex flex-col gap-xs">
4-
<DebugViewItem title="Attribute Value Id" :data="data.valueId" />
4+
<DebugViewItem title="Attribute Value Id" :data="data.attributeValueId" />
55
<DebugViewItem :data="data.kind ?? 'any'" title="Type" />
66
<DebugViewItem
77
:data="`${data.funcName} ${data.funcId}`"
@@ -21,31 +21,17 @@
2121
</DebugViewItem>
2222
<DebugViewItem title="Value" :data="data.value ?? 'NULL'" />
2323
<DebugViewItem title="Prototype Id" :data="data.prototypeId" />
24-
<DebugViewItem title="Prototype Context" :data="data.prototypeContext" />
2524
<DebugViewItem
26-
title="Implicit Attribute Value"
27-
:data="
28-
typeof data.implicitValue === 'undefined'
29-
? 'none'
30-
: data.implicitValue ?? 'NULL'
31-
"
25+
title="Materialized View"
26+
:data="data.materializedView ?? 'NULL'"
3227
/>
33-
<DebugViewItem
34-
title="Implicit Set By Function"
35-
:data="data.implicitFuncName"
36-
/>
37-
<p class="text-2xs p-2 my-2 border border-opacity-10">
38-
prototype in change set?
39-
{{ data.prototypeInChangeSet ? "y" : "n" }} value in change set?
40-
{{ data.valueInChangeSet ? "y" : "n" }}
41-
</p>
4228
</dl>
4329
</div>
4430
</template>
4531

4632
<script setup lang="ts">
47-
import { AttributeDebugData } from "@/store/components.store";
33+
import { AttributeDebugView } from "@/store/components.store";
4834
import DebugViewItem from "./DebugViewItem.vue";
4935
50-
defineProps<{ data: AttributeDebugData }>();
36+
defineProps<{ data: AttributeDebugView }>();
5137
</script>

app/web/src/components/ComponentDebugDetails.vue renamed to app/web/src/components/Debug/ComponentDebugDetails.vue

Lines changed: 7 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -30,7 +30,7 @@
3030
<Collapsible
3131
:defaultOpen="false"
3232
contentAs="ul"
33-
label="Attributes - Not Reimplemented"
33+
label="Attributes"
3434
textSize="lg"
3535
>
3636
<Collapsible
@@ -43,15 +43,15 @@
4343
extraBorderAtBottomOfContent
4444
xPadding="double"
4545
>
46-
<AttributeDebugView :data="attribute.debugData" />
46+
<AttributeDebugView :data="attribute" />
4747
</Collapsible>
4848
</Collapsible>
4949

5050
<!-- Input Sockets -->
5151
<Collapsible
5252
:defaultOpen="false"
5353
contentAs="ul"
54-
label="Input Sockets - Not Reimplemented"
54+
label="Input Sockets"
5555
textSize="lg"
5656
>
5757
<Collapsible
@@ -64,15 +64,15 @@
6464
extraBorderAtBottomOfContent
6565
xPadding="double"
6666
>
67-
<AttributeDebugView :data="attribute.debugData" />
67+
<SocketDebugView :data="attribute" />
6868
</Collapsible>
6969
</Collapsible>
7070

7171
<!-- Output Sockets -->
7272
<Collapsible
7373
:defaultOpen="false"
7474
contentAs="ul"
75-
label="Output Sockets - Not Reimplemented"
75+
label="Output Sockets"
7676
textSize="lg"
7777
>
7878
<Collapsible
@@ -85,7 +85,7 @@
8585
extraBorderAtBottomOfContent
8686
xPadding="double"
8787
>
88-
<AttributeDebugView :data="attribute.debugData" />
88+
<SocketDebugView :data="attribute" />
8989
</Collapsible>
9090
</Collapsible>
9191
</div>
@@ -102,6 +102,7 @@ import {
102102
import { PropType, computed, onMounted } from "vue";
103103
import { ComponentId, useComponentsStore } from "@/store/components.store";
104104
import AttributeDebugView from "./AttributeDebugView.vue";
105+
import SocketDebugView from "./SocketDebugView.vue";
105106
import DebugViewItem from "./DebugViewItem.vue";
106107
107108
const componentsStore = useComponentsStore();

app/web/src/components/DebugViewItem.vue renamed to app/web/src/components/Debug/DebugViewItem.vue

File renamed without changes.

‎app/web/src/components/Debug/SocketDebugView.vue‎

Lines changed: 56 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,56 @@
1+
<template>
2+
<div class="overflow-hidden my-xs p-xs border-opacity-10 border-l-2">
3+
<dl class="flex flex-col gap-xs">
4+
<DebugViewItem title="Attribute Value Id" :data="data.attributeValueId" />
5+
<DebugViewItem :data="data.kind ?? 'any'" title="Type" />
6+
<DebugViewItem
7+
:data="`${data.funcName} ${data.funcId}`"
8+
title="Set By Function"
9+
/>
10+
<DebugViewItem title="Input" :data="data.funcArgs ?? 'NULL'" />
11+
<DebugViewItem title="Input sources">
12+
<template #data>
13+
<ul v-if="data.argSources && Object.keys(data.argSources).length">
14+
<li v-for="[k, v] in Object.entries(data.argSources)" :key="k">
15+
<strong>{{ k }}</strong>
16+
: {{ v ?? "?" }}
17+
</li>
18+
</ul>
19+
<p v-else>No input sources</p>
20+
</template>
21+
</DebugViewItem>
22+
<DebugViewItem title="Value" :data="data.value ?? 'NULL'" />
23+
<DebugViewItem title="Prototype Id" :data="data.prototypeId" />
24+
<DebugViewItem title="Socket Id" :data="data.socketId" />
25+
<DebugViewItem title="Connection Annotations">
26+
<template #data>
27+
<ul
28+
v-if="
29+
data.connectionAnnotations && data.connectionAnnotations.length
30+
"
31+
>
32+
<li
33+
v-for="connection in data.connectionAnnotations"
34+
:key="connection"
35+
:data="connection"
36+
>
37+
{{ connection }}
38+
</li>
39+
</ul>
40+
<p v-else>No input sources</p>
41+
</template>
42+
</DebugViewItem>
43+
<DebugViewItem
44+
title="Materialized View"
45+
:data="data.materializedView ?? 'NULL'"
46+
/>
47+
</dl>
48+
</div>
49+
</template>
50+
51+
<script setup lang="ts">
52+
import { SocketDebugView } from "@/store/components.store";
53+
import DebugViewItem from "./DebugViewItem.vue";
54+
55+
defineProps<{ data: SocketDebugView }>();
56+
</script>

‎app/web/src/store/components.store.ts‎

Lines changed: 10 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -135,8 +135,10 @@ const qualificationStatusToIconMap: Record<
135135
notexists: { icon: "none" },
136136
};
137137

138-
export interface AttributeDebugData {
139-
valueId: string;
138+
export interface AttributeDebugView {
139+
path: string;
140+
name: string;
141+
attributeValueId: string;
140142
proxyFor?: string | null;
141143
funcName: string;
142144
funcId: string;
@@ -148,37 +150,20 @@ export interface AttributeDebugData {
148150
};
149151
value: object | string | number | boolean | null;
150152
prototypeId: string;
151-
prototypeContext: {
152-
prop_id: string;
153-
internal_provider_id: string;
154-
external_provider_id: string;
155-
component_id: string;
156-
};
157153
kind: string;
158-
prototypeInChangeSet: boolean;
159-
valueInChangeSet: boolean;
160-
implicitValue?: object | string | number | boolean | null;
161-
implicitValueContext?: {
162-
prop_id: string;
163-
internal_provider_id: string;
164-
external_provider_id: string;
165-
component_id: string;
166-
};
167-
implicitFuncName?: string;
154+
materializedView?: string;
168155
}
169-
170-
export interface AttributeDebugView {
171-
path: string;
172-
name: string;
173-
debugData: AttributeDebugData;
156+
export interface SocketDebugView extends AttributeDebugView {
157+
socketId: string;
158+
connectionAnnotations: string[];
174159
}
175160

176161
export interface ComponentDebugView {
177162
name: string;
178163
schemaVariantId: string;
179164
attributes: AttributeDebugView[];
180-
inputSockets: AttributeDebugView[];
181-
outputSockets: AttributeDebugView[];
165+
inputSockets: SocketDebugView[];
166+
outputSockets: SocketDebugView[];
182167
}
183168

184169
type EventBusEvents = {

‎lib/dal/src/attribute/prototype.rs‎

Lines changed: 28 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -37,6 +37,7 @@ use crate::{
3737
};
3838

3939
pub mod argument;
40+
pub mod debug;
4041

4142
#[remain::sorted]
4243
#[derive(Error, Debug)]
@@ -224,6 +225,33 @@ impl AttributePrototype {
224225

225226
Ok(None)
226227
}
228+
pub async fn find_for_input_socket(
229+
ctx: &DalContext,
230+
input_socket_id: InputSocketId,
231+
) -> AttributePrototypeResult<Option<AttributePrototypeId>> {
232+
let workspace_snapshot = ctx.workspace_snapshot()?;
233+
234+
if let Some(prototype_idx) = workspace_snapshot
235+
.edges_directed(input_socket_id, Direction::Outgoing)
236+
.await?
237+
.iter()
238+
.find(|(edge_weight, _, _)| {
239+
EdgeWeightKindDiscriminants::Prototype == edge_weight.kind().into()
240+
})
241+
.map(|(_, _, target_idx)| target_idx)
242+
{
243+
let node_weight = workspace_snapshot.get_node_weight(*prototype_idx).await?;
244+
245+
if matches!(
246+
node_weight.content_address_discriminants(),
247+
Some(ContentAddressDiscriminants::AttributePrototype)
248+
) {
249+
return Ok(Some(node_weight.id().into()));
250+
}
251+
}
252+
253+
Ok(None)
254+
}
227255

228256
pub async fn get_by_id(
229257
ctx: &DalContext,

0 commit comments

Comments
 (0)