From b2dc88d6bcda89101c9fc40e0887d433619648da Mon Sep 17 00:00:00 2001 From: Alexander Petcoglo Date: Thu, 12 Dec 2024 15:37:16 +0100 Subject: [PATCH 1/2] wip --- apps/console/src/app/[entity]/chat/render.tsx | 9 +- .../[entity]/dashboard/activity/render.tsx | 8 +- .../[entity]/models/[id]/[...path]/render.tsx | 8 +- .../src/app/[entity]/models/create/render.tsx | 8 +- .../src/app/[entity]/models/render.tsx | 8 +- .../pipelines/[id]/[...path]/render.tsx | 8 +- .../src/app/[entity]/pipelines/render.tsx | 8 +- apps/console/src/styles/global.css | 1 + .../src/new-ui/Icons/ChatCircle.tsx | 28 +++++ .../design-system/src/new-ui/Icons/index.ts | 2 + packages/toolkit/src/components/PageBase.tsx | 11 +- packages/toolkit/src/components/index.ts | 1 + .../src/components/sidebar/SidebarNav.tsx | 90 +++++++++++++ .../src/components/sidebar/SidebarNavLink.tsx | 94 ++++++++++++++ .../toolkit/src/components/sidebar/index.ts | 1 + .../components/top-bar/NamespaceSwitch.tsx | 8 +- .../src/components/top-bar/TopNavbar.tsx | 118 ++++++++++++++++++ .../toolkit/src/components/top-bar/index.ts | 1 + 18 files changed, 386 insertions(+), 26 deletions(-) create mode 100644 packages/design-system/src/new-ui/Icons/ChatCircle.tsx create mode 100644 packages/toolkit/src/components/sidebar/SidebarNav.tsx create mode 100644 packages/toolkit/src/components/sidebar/SidebarNavLink.tsx create mode 100644 packages/toolkit/src/components/sidebar/index.ts create mode 100644 packages/toolkit/src/components/top-bar/TopNavbar.tsx diff --git a/apps/console/src/app/[entity]/chat/render.tsx b/apps/console/src/app/[entity]/chat/render.tsx index 34f3623d65..9096ef44cd 100644 --- a/apps/console/src/app/[entity]/chat/render.tsx +++ b/apps/console/src/app/[entity]/chat/render.tsx @@ -1,11 +1,6 @@ "use client"; -import { - AppTopbar, - ChatView, - NamespaceSwitch, - PageBase, -} from "@instill-ai/toolkit"; +import { ChatView, PageBase, TopNavbar } from "@instill-ai/toolkit"; import { useAppAccessToken } from "~/lib/use-app-access-token"; import { useAppTrackToken } from "~/lib/useAppTrackToken"; @@ -16,7 +11,7 @@ export function ChatPageRender() { return ( - } /> + diff --git a/apps/console/src/app/[entity]/dashboard/activity/render.tsx b/apps/console/src/app/[entity]/dashboard/activity/render.tsx index 8a5f9a1780..61223227ad 100644 --- a/apps/console/src/app/[entity]/dashboard/activity/render.tsx +++ b/apps/console/src/app/[entity]/dashboard/activity/render.tsx @@ -3,10 +3,11 @@ import * as React from "react"; import { - AppTopbar, DashboardActivityPageMainView, NamespaceSwitch, PageBase, + SidebarNav, + TopNavbar, } from "@instill-ai/toolkit"; import { useAppAccessToken } from "~/lib/use-app-access-token"; @@ -18,8 +19,11 @@ export default function ActivityRender() { return ( - } /> + + + } /> + diff --git a/apps/console/src/app/[entity]/models/[id]/[...path]/render.tsx b/apps/console/src/app/[entity]/models/[id]/[...path]/render.tsx index 461eeff7bc..bd65ee3ddb 100644 --- a/apps/console/src/app/[entity]/models/[id]/[...path]/render.tsx +++ b/apps/console/src/app/[entity]/models/[id]/[...path]/render.tsx @@ -1,10 +1,11 @@ "use client"; import { - AppTopbar, ModelHubSettingPageMainView, NamespaceSwitch, PageBase, + SidebarNav, + TopNavbar, } from "@instill-ai/toolkit"; import { useAppAccessToken } from "~/lib/use-app-access-token"; @@ -16,8 +17,11 @@ export function ModelViewPageRender() { return ( - } /> + + + } /> + diff --git a/apps/console/src/app/[entity]/models/create/render.tsx b/apps/console/src/app/[entity]/models/create/render.tsx index 3d73200cac..a272e55c0f 100644 --- a/apps/console/src/app/[entity]/models/create/render.tsx +++ b/apps/console/src/app/[entity]/models/create/render.tsx @@ -1,10 +1,11 @@ "use client"; import { - AppTopbar, ModelHubCreatePageMainView, NamespaceSwitch, PageBase, + SidebarNav, + TopNavbar, } from "@instill-ai/toolkit"; import { useAppAccessToken } from "~/lib/use-app-access-token"; @@ -16,8 +17,11 @@ export function CreateModelPageRender() { return ( - } /> + + + } /> + diff --git a/apps/console/src/app/[entity]/models/render.tsx b/apps/console/src/app/[entity]/models/render.tsx index cf7b3bf4d5..94518bc3bc 100644 --- a/apps/console/src/app/[entity]/models/render.tsx +++ b/apps/console/src/app/[entity]/models/render.tsx @@ -1,10 +1,11 @@ "use client"; import { - AppTopbar, ModelHubListPageMainView, NamespaceSwitch, PageBase, + SidebarNav, + TopNavbar, } from "@instill-ai/toolkit"; import { useAppAccessToken } from "~/lib/use-app-access-token"; @@ -16,8 +17,11 @@ export function ModelsPageRender() { return ( - } /> + + + } /> + diff --git a/apps/console/src/app/[entity]/pipelines/[id]/[...path]/render.tsx b/apps/console/src/app/[entity]/pipelines/[id]/[...path]/render.tsx index f7d3450812..6408e0fad9 100644 --- a/apps/console/src/app/[entity]/pipelines/[id]/[...path]/render.tsx +++ b/apps/console/src/app/[entity]/pipelines/[id]/[...path]/render.tsx @@ -1,9 +1,10 @@ "use client"; import { - AppTopbar, NamespaceSwitch, PageBase, + SidebarNav, + TopNavbar, ViewPipeline, } from "@instill-ai/toolkit"; @@ -19,8 +20,11 @@ export function PipelineOverviewPageRender() { return ( - } /> + + + } /> + diff --git a/apps/console/src/app/[entity]/pipelines/render.tsx b/apps/console/src/app/[entity]/pipelines/render.tsx index fc340ff08a..45cde49f05 100644 --- a/apps/console/src/app/[entity]/pipelines/render.tsx +++ b/apps/console/src/app/[entity]/pipelines/render.tsx @@ -1,9 +1,10 @@ "use client"; import { - AppTopbar, NamespaceSwitch, PageBase, + SidebarNav, + TopNavbar, ViewPipelines, } from "@instill-ai/toolkit"; @@ -16,8 +17,11 @@ export const PipelinesViewPageRender = () => { return ( - } /> + + + } /> + diff --git a/apps/console/src/styles/global.css b/apps/console/src/styles/global.css index 0b83f37bfc..909a345464 100644 --- a/apps/console/src/styles/global.css +++ b/apps/console/src/styles/global.css @@ -34,6 +34,7 @@ :root { --topbar-controller-height: 48px; --topbar-nav-height: 48px; + --top-nav-height: 56px; --setting-container-padding-top: 80px; --setting-container-padding-bottom: 32px; --pipeline-builder-bottom-bar-height: 24px; diff --git a/packages/design-system/src/new-ui/Icons/ChatCircle.tsx b/packages/design-system/src/new-ui/Icons/ChatCircle.tsx new file mode 100644 index 0000000000..ad82b9dc7a --- /dev/null +++ b/packages/design-system/src/new-ui/Icons/ChatCircle.tsx @@ -0,0 +1,28 @@ +"use client"; + +import * as React from "react"; + +import { IconBase, IconBaseProps } from "./IconBase"; + +export const ChatCircle = React.forwardRef< + SVGSVGElement, + Omit +>((props, ref) => { + const { className, ...passThrough } = props; + return ( + + + + ); +}); +ChatCircle.displayName = "IconChatCircle"; diff --git a/packages/design-system/src/new-ui/Icons/index.ts b/packages/design-system/src/new-ui/Icons/index.ts index 2284a9ce7c..b4be11377d 100644 --- a/packages/design-system/src/new-ui/Icons/index.ts +++ b/packages/design-system/src/new-ui/Icons/index.ts @@ -20,6 +20,7 @@ import { Browser } from "./Browser"; import { Building05 } from "./Building05"; import { CalendarCheck01 } from "./CalendarCheck01"; import { CardRefresh } from "./CardRefresh"; +import { ChatCircle } from "./ChatCircle"; import { Check } from "./Check"; import { CheckCircle } from "./CheckCircle"; import { ChevronDown } from "./ChevronDown"; @@ -199,6 +200,7 @@ export const Icons = { Building05, CalendarCheck01, CardRefresh, + ChatCircle, Check, CheckCircle, ChevronDown, diff --git a/packages/toolkit/src/components/PageBase.tsx b/packages/toolkit/src/components/PageBase.tsx index 8d39894295..3cd1de3f74 100644 --- a/packages/toolkit/src/components/PageBase.tsx +++ b/packages/toolkit/src/components/PageBase.tsx @@ -8,7 +8,13 @@ export const PageBase = ({ children }: { children: React.ReactNode }) => { }; const Container = ({ children }: { children: React.ReactNode }) => { - return
{children}
; + return
{children}
; +}; + +const Sidebar = ({ children }: { children: React.ReactNode }) => { + return ( +
{children}
+ ); }; const Content = ({ @@ -22,7 +28,7 @@ const Content = ({
@@ -34,3 +40,4 @@ const Content = ({ PageBase.Container = Container; PageBase.Content = Content; +PageBase.Sidebar = Sidebar; diff --git a/packages/toolkit/src/components/index.ts b/packages/toolkit/src/components/index.ts index 7fb40fbca6..094486f3ed 100644 --- a/packages/toolkit/src/components/index.ts +++ b/packages/toolkit/src/components/index.ts @@ -41,3 +41,4 @@ export * from "./RunsTableSortableColHeader"; export * from "./VersionDropdownSelector"; export * from "./CopiedTooltip"; export * from "./PlaygroundSkeleton"; +export * from "./sidebar"; diff --git a/packages/toolkit/src/components/sidebar/SidebarNav.tsx b/packages/toolkit/src/components/sidebar/SidebarNav.tsx new file mode 100644 index 0000000000..64c868e13a --- /dev/null +++ b/packages/toolkit/src/components/sidebar/SidebarNav.tsx @@ -0,0 +1,90 @@ +import * as React from "react"; +import { useRouter } from "next/navigation"; + +import { Button } from "@instill-ai/design-system"; + +import { + InstillStore, + useAuthenticatedUser, + useInstillStore, + useShallow, +} from "../../lib"; +import { NamespaceSwitch } from "../top-bar"; +import { SidebarNavLink, SidebarNavLinkProps } from "./SidebarNavLink"; + +const navLinkItems: SidebarNavLinkProps[] = [ + { + pathname: "dashboard", + iconName: "BarChartSquare02", + title: "Dashboard", + }, + { + pathname: "catalog", + iconName: "Database01", + title: "Artifacts", + }, + { + pathname: "pipelines", + iconName: "Pipeline", + title: "Pipelines", + strict: true, + }, + { + pathname: "models", + iconName: "Cube01", + title: "Models", + strict: true, + }, + /*{ + pathname: "applications", + iconName: "Browser", + title: "Applications", + },*/ +]; + +const selector = (store: InstillStore) => ({ + accessToken: store.accessToken, + enabledQuery: store.enabledQuery, +}); + +export const SidebarNav = ({ + namespaceSwitch, +}: { + namespaceSwitch?: React.ReactNode; +}) => { + const router = useRouter(); + const { accessToken, enabledQuery } = useInstillStore(useShallow(selector)); + const me = useAuthenticatedUser({ + enabled: enabledQuery, + accessToken, + }); + + return me.isSuccess ? ( +
+ {me.isSuccess ? ( + (namespaceSwitch ?? ) + ) : ( + + )} + {navLinkItems.map(({ pathname, iconName, title, strict }) => ( + + ))} +
+ ) : null; +}; diff --git a/packages/toolkit/src/components/sidebar/SidebarNavLink.tsx b/packages/toolkit/src/components/sidebar/SidebarNavLink.tsx new file mode 100644 index 0000000000..5ea4931e7f --- /dev/null +++ b/packages/toolkit/src/components/sidebar/SidebarNavLink.tsx @@ -0,0 +1,94 @@ +import * as React from "react"; +import { usePathname, useRouter } from "next/navigation"; + +import { cn, Icons } from "@instill-ai/design-system"; + +import { + InstillStore, + useInstillStore, + useShallow, + useUserNamespaces, +} from "../../lib"; + +export type SidebarNavLinkProps = { + title: string; + iconName: keyof typeof Icons; + pathname: string; + strict?: boolean; + isExploreRoute?: boolean; +}; + +const navLinkSelector = (store: InstillStore) => ({ + navigationNamespaceAnchor: store.navigationNamespaceAnchor, +}); + +export const SidebarNavLink = ({ + title, + iconName, + pathname, + strict, + isExploreRoute, +}: SidebarNavLinkProps) => { + const router = useRouter(); + const currentPathname = usePathname(); + const { navigationNamespaceAnchor } = useInstillStore( + useShallow(navLinkSelector), + ); + + const Icon = Icons[iconName]; + + const isOnIt = React.useMemo(() => { + if (isExploreRoute) { + return false; + } + + if (strict) { + return currentPathname.split("/")[2] === pathname; + } else { + return currentPathname.includes(pathname); + } + }, [pathname, currentPathname, strict, isExploreRoute]); + + const userNamespaces = useUserNamespaces(); + + const namespaceAnchor = React.useMemo(() => { + if (!userNamespaces.isSuccess) { + return null; + } + + if (!navigationNamespaceAnchor) { + const userNamespace = userNamespaces.data.find( + (namespace) => namespace.type === "user", + ); + + if (userNamespace) { + return userNamespace.id; + } + } + + return navigationNamespaceAnchor; + }, [ + userNamespaces.isSuccess, + userNamespaces.data, + navigationNamespaceAnchor, + ]); + + return ( + + ); +}; diff --git a/packages/toolkit/src/components/sidebar/index.ts b/packages/toolkit/src/components/sidebar/index.ts new file mode 100644 index 0000000000..767095e200 --- /dev/null +++ b/packages/toolkit/src/components/sidebar/index.ts @@ -0,0 +1 @@ +export * from "./SidebarNav"; diff --git a/packages/toolkit/src/components/top-bar/NamespaceSwitch.tsx b/packages/toolkit/src/components/top-bar/NamespaceSwitch.tsx index 4eb7e835b7..dba82a9484 100644 --- a/packages/toolkit/src/components/top-bar/NamespaceSwitch.tsx +++ b/packages/toolkit/src/components/top-bar/NamespaceSwitch.tsx @@ -384,10 +384,8 @@ export const NamespaceSwitch = () => { } className={cn( - "!w-[136px] !border-none !p-1 hover:!bg-semantic-bg-secondary", - switchIsOpen - ? "!bg-semantic-bg-secondary" - : "!bg-semantic-bg-primary", + "!border-none !p-0 !bg-transparent !shadow-none focus:!ring-0", + "[&>span]:w-full", )} > {selectedNamespace ? ( @@ -396,7 +394,7 @@ export const NamespaceSwitch = () => {
({ + accessToken: store.accessToken, + enabledQuery: store.enabledQuery, +}); + +const getMenuItems = ({ + userId, +}: { + userId?: string; +}): { + title: string; + href: string; + iconName: keyof typeof Icons; + external?: boolean; +}[] => [ + { + title: "Chat", + href: `/${userId}/chat`, + iconName: "ChatCircle", + }, + { + title: "Build", + href: `/${userId}/pipelines`, + iconName: "Browser", + }, + { + title: "Community", + href: "https://discord.com/invite/sevxWsqpGh", + iconName: "MessageSmileSquare", + external: true, + }, +]; + +export const TopNavbar = () => { + const { accessToken, enabledQuery } = useInstillStore(useShallow(selector)); + const me = useAuthenticatedUser({ + enabled: enabledQuery, + accessToken, + }); + + const isCloud = env("NEXT_PUBLIC_APP_ENV") === "CLOUD"; + const navigate = useGuardPipelineBuilderUnsavedChangesNavigation(); + const currentPathname = usePathname(); + const isChatPath = currentPathname.split("/")[2] === "chat"; + + return ( +
+ +
+ {getMenuItems({ userId: me.data?.id }).map((item) => { + const Icon = Icons[item.iconName]; + const isChatLink = item.href.split("/")[2] === "chat"; + const isExternalLink = item.href.includes("http"); + let isActive = false; + + if (isChatLink) { + if (isChatPath) { + isActive = true; + } + } else { + if (!isExternalLink && !isChatPath) { + isActive = true; + } + } + + return ( + + + + {item.title} + + + ); + })} + {isCloud ? : } +
+
+ ); +}; diff --git a/packages/toolkit/src/components/top-bar/index.ts b/packages/toolkit/src/components/top-bar/index.ts index 5e44033a86..6225b733bf 100644 --- a/packages/toolkit/src/components/top-bar/index.ts +++ b/packages/toolkit/src/components/top-bar/index.ts @@ -1,2 +1,3 @@ export * from "./AppTopbar"; export * from "./NamespaceSwitch"; +export * from "./TopNavbar"; From d427df8b504443f5b5676afd8264e607637871e4 Mon Sep 17 00:00:00 2001 From: Alexander Petcoglo Date: Fri, 13 Dec 2024 17:01:57 +0100 Subject: [PATCH 2/2] feat: new navigation --- apps/console/src/app/[entity]/catalog/render.tsx | 8 ++++++-- .../src/app/[entity]/dashboard/cost/model/render.tsx | 8 ++++++-- .../src/app/[entity]/dashboard/cost/pipeline/render.tsx | 8 ++++++-- .../src/app/[entity]/dashboard/pipeline/[id]/render.tsx | 8 ++++++-- .../src/app/[entity]/dashboard/pipeline/render.tsx | 8 ++++++-- apps/console/src/app/settings/account/render.tsx | 5 ++--- apps/console/src/app/settings/api-tokens/render.tsx | 5 ++--- apps/console/src/app/settings/integrations/render.tsx | 5 ++--- apps/console/src/app/settings/profile/rendex.tsx | 5 ++--- apps/console/src/app/settings/secrets/render.tsx | 5 ++--- packages/toolkit/src/components/top-bar/TopNavbar.tsx | 5 ++++- .../src/view/dashboard/activity/ModelTriggersSummary.tsx | 2 +- .../dashboard/activity/ModelsTriggerCountsLineChart.tsx | 4 ++-- .../dashboard/activity/PipelineTriggerCountsLineChart.tsx | 4 ++-- .../view/dashboard/activity/PipelineTriggersSummary.tsx | 2 +- 15 files changed, 50 insertions(+), 32 deletions(-) diff --git a/apps/console/src/app/[entity]/catalog/render.tsx b/apps/console/src/app/[entity]/catalog/render.tsx index 1523347637..2c999f3e38 100644 --- a/apps/console/src/app/[entity]/catalog/render.tsx +++ b/apps/console/src/app/[entity]/catalog/render.tsx @@ -3,10 +3,11 @@ import { useRouter } from "next/navigation"; import { - AppTopbar, CatalogMainView, NamespaceSwitch, PageBase, + SidebarNav, + TopNavbar, } from "@instill-ai/toolkit"; import { useAppAccessToken } from "~/lib/use-app-access-token"; @@ -21,8 +22,11 @@ export const KnowladgeBasePageRender = () => { return ( - } /> + + + } /> + - } /> + + + } /> + diff --git a/apps/console/src/app/[entity]/dashboard/cost/pipeline/render.tsx b/apps/console/src/app/[entity]/dashboard/cost/pipeline/render.tsx index 31f3f113ad..6feef62f0e 100644 --- a/apps/console/src/app/[entity]/dashboard/cost/pipeline/render.tsx +++ b/apps/console/src/app/[entity]/dashboard/cost/pipeline/render.tsx @@ -3,10 +3,11 @@ import * as React from "react"; import { - AppTopbar, DashboardCostPipelinePageMainView, NamespaceSwitch, PageBase, + SidebarNav, + TopNavbar, } from "@instill-ai/toolkit"; import { useAppAccessToken } from "~/lib/use-app-access-token"; @@ -18,8 +19,11 @@ export default function CostPipelineRender() { return ( - } /> + + + } /> + diff --git a/apps/console/src/app/[entity]/dashboard/pipeline/[id]/render.tsx b/apps/console/src/app/[entity]/dashboard/pipeline/[id]/render.tsx index 12a6636529..5b28af5217 100644 --- a/apps/console/src/app/[entity]/dashboard/pipeline/[id]/render.tsx +++ b/apps/console/src/app/[entity]/dashboard/pipeline/[id]/render.tsx @@ -1,10 +1,11 @@ "use client"; import { - AppTopbar, DashboardPipelineDetailsPageMainView, NamespaceSwitch, PageBase, + SidebarNav, + TopNavbar, } from "@instill-ai/toolkit"; import { useAppAccessToken } from "~/lib/use-app-access-token"; @@ -16,8 +17,11 @@ export function PipelineDashboardPageRender() { return ( - } /> + + + } /> + diff --git a/apps/console/src/app/[entity]/dashboard/pipeline/render.tsx b/apps/console/src/app/[entity]/dashboard/pipeline/render.tsx index ebbbfd4af0..a4d3596569 100644 --- a/apps/console/src/app/[entity]/dashboard/pipeline/render.tsx +++ b/apps/console/src/app/[entity]/dashboard/pipeline/render.tsx @@ -3,11 +3,12 @@ import { useRouter } from "next/navigation"; import { - AppTopbar, DashboardContainer, DashboardPipelineListPageMainView, NamespaceSwitch, PageBase, + SidebarNav, + TopNavbar, } from "@instill-ai/toolkit"; import { useAppAccessToken } from "~/lib/use-app-access-token"; @@ -21,8 +22,11 @@ export function DashboardPageRender() { return ( - } /> + + + } /> + - } /> + - } /> + - } /> + - } /> + - } /> + { const navigate = useGuardPipelineBuilderUnsavedChangesNavigation(); const currentPathname = usePathname(); const isChatPath = currentPathname.split("/")[2] === "chat"; + const isSettingsRoute = + currentPathname.includes("/settings/") || + currentPathname.includes("/organization-settings/"); return (
@@ -85,7 +88,7 @@ export const TopNavbar = () => { isActive = true; } } else { - if (!isExternalLink && !isChatPath) { + if (!isChatPath && !isSettingsRoute && !isExternalLink) { isActive = true; } } diff --git a/packages/toolkit/src/view/dashboard/activity/ModelTriggersSummary.tsx b/packages/toolkit/src/view/dashboard/activity/ModelTriggersSummary.tsx index 6121d905ac..88986864f3 100644 --- a/packages/toolkit/src/view/dashboard/activity/ModelTriggersSummary.tsx +++ b/packages/toolkit/src/view/dashboard/activity/ModelTriggersSummary.tsx @@ -85,7 +85,7 @@ export const ModelTriggersSummary = (props: ModelTriggersSummaryProps) => { return ( -
{children}
+
{children}
 ); }; diff --git a/packages/toolkit/src/view/dashboard/activity/ModelsTriggerCountsLineChart.tsx b/packages/toolkit/src/view/dashboard/activity/ModelsTriggerCountsLineChart.tsx index a17be59102..d2b473027d 100644 --- a/packages/toolkit/src/view/dashboard/activity/ModelsTriggerCountsLineChart.tsx +++ b/packages/toolkit/src/view/dashboard/activity/ModelsTriggerCountsLineChart.tsx @@ -70,10 +70,10 @@ export const ModelsTriggerCountsLineChart = ({ }, graphic: { type: "image", + left: "center", style: { image: "/images/no-chart-placeholder.svg", - x: "45%", - y: "0%", + y: "10%", width: models.length === 0 ? 225 : 0, height: models.length === 0 ? 225 : 0, }, diff --git a/packages/toolkit/src/view/dashboard/activity/PipelineTriggerCountsLineChart.tsx b/packages/toolkit/src/view/dashboard/activity/PipelineTriggerCountsLineChart.tsx index bc207b150d..8697beccb9 100644 --- a/packages/toolkit/src/view/dashboard/activity/PipelineTriggerCountsLineChart.tsx +++ b/packages/toolkit/src/view/dashboard/activity/PipelineTriggerCountsLineChart.tsx @@ -72,10 +72,10 @@ export const PipelineTriggerCountsLineChart = ({ }, graphic: { type: "image", + left: "center", style: { image: "/images/no-chart-placeholder.svg", - x: "45%", - y: "0%", + y: "10%", width: pipelines.length === 0 ? 225 : 0, height: pipelines.length === 0 ? 225 : 0, }, diff --git a/packages/toolkit/src/view/dashboard/activity/PipelineTriggersSummary.tsx b/packages/toolkit/src/view/dashboard/activity/PipelineTriggersSummary.tsx index 44d3721c2e..bc60900dbd 100644 --- a/packages/toolkit/src/view/dashboard/activity/PipelineTriggersSummary.tsx +++ b/packages/toolkit/src/view/dashboard/activity/PipelineTriggersSummary.tsx @@ -88,7 +88,7 @@ export const PipelineTriggersSummary = ( return ( -
{children}
+
{children}
 ); };