diff --git a/stories/flow-lineage/f-lineage.stories.ts b/stories/flow-lineage/f-lineage.stories.ts
index e7f4e682f..f520cb1ee 100644
--- a/stories/flow-lineage/f-lineage.stories.ts
+++ b/stories/flow-lineage/f-lineage.stories.ts
@@ -120,29 +120,32 @@ export const Playground = {
["max-children"]: 8,
["node-template"]: function (node: LineageNodeElement) {
- return html`
-
+ return html`
+
+
+
updateTooltip(node.id ?? "NA")}
- direction="column"
- tooltip="#lineage-tooltip"
- height="hug-content"
+ state=${node.id === "Max" ? "custom,#006ecc" : "secondary"}
+ width="100%"
+ height="100%"
+ padding="none medium"
align="middle-left"
+ variant="curved"
+ gap="small"
+ ${node.fChildren && !node.fHideChildren ? 'border="small solid default bottom"' : ""}
>
- ${node.id}
- x: ${node.x}, y: ${node.y}
-
- ${node.childrenToggle}
- `;
+
+ updateTooltip(node.id ?? "NA")}
+ direction="column"
+ tooltip="#lineage-tooltip"
+ height="hug-content"
+ align="middle-left"
+ >
+ ${node.id}
+
+ ${node.childrenToggle}
+ `;
},
["children-node-template"]: function (node: LineageNodeElement) {
@@ -165,6 +168,10 @@ export const Playground = {
from: "Tony",
to: "Charlie"
},
+ {
+ from: "Charlie",
+ to: "Tony"
+ },
{
from: "Max",
to: "Charlie"
@@ -259,6 +266,122 @@ export const Playground = {
name: "Calvin"
},
+ fNodeMeta: {
+ title: "StreetTree_Census.Environment",
+ subTitle: "datapipes_census.street_2022",
+
+ tabSections: {
+ ["Table Details"]: {
+ ["Created on"]: {
+ type: "text",
+ value: "Today, 09:39 pm"
+ },
+
+ ["Updated on"]: {
+ type: "text",
+ value: "Today, 11:39 pm"
+ },
+
+ ["Owner"]: {
+ type: "text",
+ value: "name@gmail.com"
+ },
+
+ ["Domain"]: {
+ type: "tag",
+ value: "Code Pipes",
+ iconLeft: "💰"
+ },
+
+ ["Classification"]: {
+ type: "tag",
+ value: "Code Pipes",
+ iconLeft: "💰"
+ },
+
+ ["Description"]: {
+ type: "text",
+ value: "This is a description of the table in"
+ },
+
+ ["Tags"]: {
+ type: "text",
+ value: "Code promotion, Catalog, Ingest, Active users"
+ },
+
+ ["Columns"]: {
+ type: "text",
+ value: "12"
+ },
+
+ ["Rows"]: {
+ type: "text",
+ value: "2.2k"
+ },
+
+ ["Visibility"]: {
+ type: "text",
+ value: "Visible to all"
+ },
+
+ ["Glossary"]: {
+ type: "link",
+ value: "Glossary 1, Glossary 2, Glossary 3, Glossary 4"
+ }
+ },
+
+ ["Transformation Details"]: {
+ ["Mode"]: {
+ type: "text",
+ value: "DataBrew"
+ },
+
+ ["Timestamp"]: {
+ type: "text",
+ value: "Wed Sept 21 2022 12:06:03 GMT +0530 (IST)"
+ },
+
+ ["User"]: {
+ type: "text",
+ value: "name@gmail.com"
+ },
+
+ ["Recipe Name"]: {
+ type: "text",
+ value: "testing-recipe"
+ },
+
+ codeSnippet: {
+ type: "code",
+
+ value: `
+ Recipe steps(6):
+
+
+ 1. Delete column dateChecked, hash, negative, positive
+
+
+ 2. Filter values by state
+
+
+ 3. Create column date_formattedusing dateTime.
+
+
+ 4. Change type of date_formattedto Date
+
+
+ 5. Delete column date
+
+
+ 6. Create column positiveRateusing Math function
+ DIVIDE
+
+ `
+ }
+ }
+ }
+ },
+
fChildren: {
child1: {
fNodeMeta: {
@@ -293,6 +416,9 @@ export const Playground = {
},
fClick: function (event: CustomEvent, node: LineageNodeElement) {
+ if (divRef.value) {
+ divRef.value.requestFullscreen();
+ }
console.log("Node Clicked", event, node);
},
@@ -312,6 +438,122 @@ export const Playground = {
console.log("Node Right Clicked", event, node);
},
+ fNodeMeta: {
+ title: "StreetTree_Census.Environment",
+ subTitle: "datapipes_census.street_2022",
+
+ tabSections: {
+ ["Table Details"]: {
+ ["Created on"]: {
+ type: "text",
+ value: "Today, 09:39 pm"
+ },
+
+ ["Updated on"]: {
+ type: "text",
+ value: "Today, 11:39 pm"
+ },
+
+ ["Owner"]: {
+ type: "text",
+ value: "name@gmail.com"
+ },
+
+ ["Domain"]: {
+ type: "tag",
+ value: "Code Pipes",
+ iconLeft: "💰"
+ },
+
+ ["Classification"]: {
+ type: "tag",
+ value: "Code Pipes",
+ iconLeft: "💰"
+ },
+
+ ["Description"]: {
+ type: "text",
+ value: "This is a description of the table in"
+ },
+
+ ["Tags"]: {
+ type: "text",
+ value: "Code promotion, Catalog, Ingest, Active users"
+ },
+
+ ["Columns"]: {
+ type: "text",
+ value: "12"
+ },
+
+ ["Rows"]: {
+ type: "text",
+ value: "2.2k"
+ },
+
+ ["Visibility"]: {
+ type: "text",
+ value: "Visible to all"
+ },
+
+ ["Glossary"]: {
+ type: "link",
+ value: "Glossary 1, Glossary 2, Glossary 3, Glossary 4"
+ }
+ },
+
+ ["Transformation Details"]: {
+ ["Mode"]: {
+ type: "text",
+ value: "DataBrew"
+ },
+
+ ["Timestamp"]: {
+ type: "text",
+ value: "Wed Sept 21 2022 12:06:03 GMT +0530 (IST)"
+ },
+
+ ["User"]: {
+ type: "text",
+ value: "name@gmail.com"
+ },
+
+ ["Recipe Name"]: {
+ type: "text",
+ value: "testing-recipe"
+ },
+
+ codeSnippet: {
+ type: "code",
+
+ value: `
+ Recipe steps(6):
+
+
+ 1. Delete column dateChecked, hash, negative, positive
+
+
+ 2. Filter values by state
+
+
+ 3. Create column date_formattedusing dateTime.
+
+
+ 4. Change type of date_formattedto Date
+
+
+ 5. Delete column date
+
+
+ 6. Create column positiveRateusing Math function
+ DIVIDE
+
+ `
+ }
+ }
+ }
+ },
+
fChildren: {
hchild1: {}
}