Merge pull request #786 from zenml-io/staging

Release

Author: Cahllagerfeld

package.json

@@ -88,6 +88,8 @@
 		"overrides": {
 			"@babel/helpers": "^7.26.10",
 			"@babel/runtime": "^7.26.10",
+			"brace-expansion@1": "1.1.12",
+			"brace-expansion@2": "2.0.2",
 			"braces": "^3.0.3",
 			"cross-spawn": "^7.0.5",
 			"micromatch": "^4.0.8",

pnpm-lock.yaml

@@ -3,7 +3,7 @@ import { exit } from "process";
 
 const allowedStatuses = [401, 403, 405];
 
-const ignoreList = [];
+const ignoreList = ["https://zenml.io/logo.png"];
 
 const headers = new Headers({
 	"User-Agent": "ZenMLURLBot/1.0 (+http://zenml.io/bot)"

scripts/check-links.js

@@ -7,9 +7,9 @@ import { snakeCaseToTitleCase } from "@/lib/strings";
 import { sanitizeUrl } from "@/lib/url";
 import { StackComponent } from "@/types/components";
 import { ColumnDef } from "@tanstack/react-table";
+import { Checkbox } from "@zenml-io/react-component-library/components/client";
 import { Tag } from "@zenml-io/react-component-library/components/server";
 import { ComponentDropdown } from "./component-dropdown";
-import { Checkbox } from "@zenml-io/react-component-library/components/client";
 
 export function getComponentList(): ColumnDef<StackComponent>[] {
 	return [
@@ -114,9 +114,15 @@ export function getComponentList(): ColumnDef<StackComponent>[] {
 			header: "Author",
 			accessorFn: (row) => row.resources?.user?.name,
 			cell: ({ row }) => {
-				const author = row.original.resources?.user?.name;
+				const author = row.original.resources?.user;
 				if (!author) return null;
-				return <InlineAvatar username={author} />;
+				return (
+					<InlineAvatar
+						avatarUrl={author.body?.avatar_url ?? undefined}
+						username={author.name}
+						isServiceAccount={!!author.body?.is_service_account}
+					/>
+				);
 			}
 		},
 		{

src/app/components/columns.tsx

@@ -37,7 +37,8 @@ export function GithubPipelineSheet({
 	pipelineContent,
 	open,
 	name,
-	displayName
+	displayName,
+	isDone
 }: PropsWithChildren<Props>) {
 	return (
 		<Sheet open={open} onOpenChange={onOpenChange}>
@@ -47,7 +48,7 @@ export function GithubPipelineSheet({
 				<SecondaryHeader
 					displayName={displayName}
 					pipelineContent={pipelineContent}
-					isDone={false}
+					isDone={isDone}
 					name={name}
 				/>
 				<div className="p-5">

src/app/overview/pipelines-grid/pipeline-sheet.tsx

@@ -1,6 +1,12 @@
 import { useCurrentUser } from "@/data/users/current-user-query";
+import { sanitizeUrl } from "@/lib/url";
 import { getUsername } from "@/lib/user";
-import { Avatar, AvatarFallback, Skeleton } from "@zenml-io/react-component-library/components";
+import {
+	Avatar,
+	AvatarFallback,
+	AvatarImage,
+	Skeleton
+} from "@zenml-io/react-component-library/components";
 
 export function Welcome() {
 	const userQuery = useCurrentUser();
@@ -23,6 +29,7 @@ export function Welcome() {
 	return (
 		<div className="flex items-center gap-3">
 			<Avatar size="xl">
+				<AvatarImage src={sanitizeUrl(userQuery.data?.body?.avatar_url ?? undefined)} />
 				<AvatarFallback size="xl">{name?.charAt(0) || "U"}</AvatarFallback>
 			</Avatar>
 			<span className="text-display-xs font-semibold">Welcome back{name ? `, ${name}` : ""}</span>

src/app/overview/welcome.tsx

@@ -155,7 +155,13 @@ export function getPipelineDetailColumns(): ColumnDef<PipelineRun>[] {
 			accessorFn: (row) => ({ author: row.resources?.user }),
 			cell: ({ getValue }) => {
 				const { author } = getValue<{ author: User }>();
-				return <InlineAvatar username={author.name} />;
+				return (
+					<InlineAvatar
+						avatarUrl={author.body?.avatar_url ?? undefined}
+						username={author.name}
+						isServiceAccount={!!author.body?.is_service_account}
+					/>
+				);
 			}
 		},
 		{

src/app/pipelines/[namespace]/columns.tsx

@@ -2,8 +2,10 @@ import AlertCircle from "@/assets/icons/alert-circle.svg?react";
 import { ArtifactNode } from "@/components/dag-visualizer/ArtifactNode";
 import { DagControls } from "@/components/dag-visualizer/Controls";
 import { ElkEdge } from "@/components/dag-visualizer/elk-edge";
+import { GlobalSheets } from "@/components/dag-visualizer/global-sheets";
 import { PreviewArtifactNode } from "@/components/dag-visualizer/PreviewArtifact";
 import { PreviewStepNode } from "@/components/dag-visualizer/PreviewStep";
+import { SheetProvider } from "@/components/dag-visualizer/sheet-context";
 import { StepNode } from "@/components/dag-visualizer/StepNode";
 import { EmptyState } from "@/components/EmptyState";
 import { Spinner } from "@zenml-io/react-component-library/components/server";
@@ -58,33 +60,36 @@ export function DAG() {
 		);
 
 	return (
-		<ReactFlow
-			minZoom={-2}
-			connectOnClick={false}
-			nodesDraggable={false}
-			nodesConnectable={false}
-			edgeTypes={customEdge}
-			nodeTypes={customNodes}
-			nodes={nodes}
-			edges={edges}
-			edgesFocusable={false}
-			onlyRenderVisibleElements
-			multiSelectionKeyCode={null}
-			onNodesChange={onNodesChange}
-			onEdgesChange={onEdgesChange}
-			fitView
-			fitViewOptions={
-				shouldFitView
-					? undefined
-					: topMostNode
-						? {
-								nodes: [topMostNode],
-								maxZoom: 1.2
-							}
-						: undefined
-			}
-		>
-			<DagControls refetch={handleRefetch} />
-		</ReactFlow>
+		<SheetProvider>
+			<ReactFlow
+				minZoom={-2}
+				connectOnClick={false}
+				nodesDraggable={false}
+				nodesConnectable={false}
+				edgeTypes={customEdge}
+				nodeTypes={customNodes}
+				nodes={nodes}
+				edges={edges}
+				edgesFocusable={false}
+				onlyRenderVisibleElements
+				multiSelectionKeyCode={null}
+				onNodesChange={onNodesChange}
+				onEdgesChange={onEdgesChange}
+				fitView
+				fitViewOptions={
+					shouldFitView
+						? undefined
+						: topMostNode
+							? {
+									nodes: [topMostNode],
+									maxZoom: 1.2
+								}
+							: undefined
+				}
+			>
+				<DagControls refetch={handleRefetch} />
+			</ReactFlow>
+			<GlobalSheets />
+		</SheetProvider>
 	);
 }

src/app/runs/[id]/Dag.tsx

@@ -156,7 +156,11 @@ export function Details() {
 					<Key>Author</Key>
 					<Value>
 						<div className="inline-flex items-center gap-1">
-							<InlineAvatar username={data.resources?.user?.name || ""} />
+							<InlineAvatar
+								avatarUrl={data.resources?.user?.body?.avatar_url ?? undefined}
+								username={data.resources?.user?.name ?? "Unknown"}
+								isServiceAccount={!!data.resources?.user?.body?.is_service_account}
+							/>
 						</div>
 					</Value>
 					<Key>Start Time</Key>

src/app/runs/[id]/_Tabs/Overview/Details.tsx

@@ -153,14 +153,17 @@ export const runsColumns: ColumnDef<PipelineRun>[] = [
 		accessorFn: (row) => ({
 			name: row.resources?.user?.name
 		}),
-		cell: ({ getValue }) => {
-			const { name } = getValue<{
-				name?: string;
-			}>();
-
-			if (!name) return null;
+		cell: ({ row }) => {
+			const author = row.original.resources?.user;
+			if (!author) return null;
 
-			return <InlineAvatar username={name} />;
+			return (
+				<InlineAvatar
+					avatarUrl={author.body?.avatar_url ?? undefined}
+					username={author.name}
+					isServiceAccount={!!author.body?.is_service_account}
+				/>
+			);
 		}
 	},
 	{