Skip to content

Commit c8858ed

Browse files
samejrsamejr
authored
New jump to parent or root run buttons (#2067)
* Change the color to indigo * Pro tier pricing information now matches the marketing site * Update the button styles to secondary * WIP adding separate links to Parent and Root runs * TextLink now supports optional shortcuts * Adds shortcut keys to the root and parent links + the shortcut help panel * Adds new icons for root and parent * root friendlyId works * Updates icons for jump to root and parent * Copy tweak * Improve how the Free tier shows no preview branches * Improve the wording in the tooltip * Align the x icon better * Show price for additional preview branches * Change the shortcut key * Fixes button alignment * Adds nested dependencies task hello-world * Fixes typo “Cancelled” * Removes taskIdentifier, not needed * Removes unused taskIdentifier
1 parent 9c08764 commit c8858ed

File tree

9 files changed

+343
-75
lines changed

9 files changed

+343
-75
lines changed

‎apps/webapp/app/assets/icons/MoveToTopIcon.tsx‎

Lines changed: 34 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,34 @@
1+
export function MoveToTopIcon({ className }: { className?: string }) {
2+
return (
3+
<svg className={className} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
4+
<g clipPath="url(#clip0_17186_103975)">
5+
<path
6+
d="M12 21L12 9"
7+
stroke="currentColor"
8+
strokeWidth="2"
9+
strokeLinecap="round"
10+
strokeLinejoin="round"
11+
/>
12+
<path
13+
d="M3 3L21 3"
14+
stroke="currentColor"
15+
strokeWidth="2"
16+
strokeLinecap="round"
17+
strokeLinejoin="round"
18+
/>
19+
<path
20+
d="M16.5 11.5L12 7L7.5 11.5"
21+
stroke="currentColor"
22+
strokeWidth="2"
23+
strokeLinecap="round"
24+
strokeLinejoin="round"
25+
/>
26+
</g>
27+
<defs>
28+
<clipPath id="clip0_17186_103975">
29+
<rect width="24" height="24" fill="currentColor" />
30+
</clipPath>
31+
</defs>
32+
</svg>
33+
);
34+
}

‎apps/webapp/app/assets/icons/MoveUpIcon.tsx‎

Lines changed: 41 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,41 @@
1+
export function MoveUpIcon({ className }: { className?: string }) {
2+
return (
3+
<svg className={className} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
4+
<g clipPath="url(#clip0_17177_110851)">
5+
<path
6+
d="M12 21L12 13"
7+
stroke="currentColor"
8+
strokeWidth="2"
9+
strokeLinecap="round"
10+
strokeLinejoin="round"
11+
/>
12+
<path
13+
d="M3 3L21 3"
14+
stroke="currentColor"
15+
strokeWidth="2"
16+
strokeLinecap="round"
17+
strokeLinejoin="round"
18+
/>
19+
<path
20+
d="M3 7L21 7"
21+
stroke="currentColor"
22+
strokeWidth="2"
23+
strokeLinecap="round"
24+
strokeLinejoin="round"
25+
/>
26+
<path
27+
d="M16.5 15.5L12 11L7.5 15.5"
28+
stroke="currentColor"
29+
strokeWidth="2"
30+
strokeLinecap="round"
31+
strokeLinejoin="round"
32+
/>
33+
</g>
34+
<defs>
35+
<clipPath id="clip0_17177_110851">
36+
<rect width="24" height="24" fill="currentColor" />
37+
</clipPath>
38+
</defs>
39+
</svg>
40+
);
41+
}

‎apps/webapp/app/components/Shortcuts.tsx‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -147,6 +147,12 @@ function ShortcutContent() {
147147
</Paragraph>
148148
<ShortcutKey shortcut={{ key: "9" }} variant="medium/bright" />
149149
</Shortcut>
150+
<Shortcut name="Jump to root run">
151+
<ShortcutKey shortcut={{ key: "t" }} variant="medium/bright" />
152+
</Shortcut>
153+
<Shortcut name="Jump to parent run">
154+
<ShortcutKey shortcut={{ key: "p" }} variant="medium/bright" />
155+
</Shortcut>
150156
</div>
151157
<div className="space-y-3">
152158
<Header3>Schedules page</Header3>

‎apps/webapp/app/components/primitives/TextLink.tsx‎

Lines changed: 53 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,10 @@
11
import { Link } from "@remix-run/react";
22
import { cn } from "~/utils/cn";
33
import { Icon, type RenderIcon } from "./Icon";
4+
import { useRef } from "react";
5+
import { type ShortcutDefinition, useShortcutKeys } from "~/hooks/useShortcutKeys";
6+
import { ShortcutKey } from "./ShortcutKey";
7+
import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from "./Tooltip";
48

59
const variations = {
610
primary:
@@ -17,6 +21,9 @@ type TextLinkProps = {
1721
trailingIconClassName?: string;
1822
variant?: keyof typeof variations;
1923
children: React.ReactNode;
24+
shortcut?: ShortcutDefinition;
25+
hideShortcutKey?: boolean;
26+
tooltip?: React.ReactNode;
2027
} & React.AnchorHTMLAttributes<HTMLAnchorElement>;
2128

2229
export function TextLink({
@@ -27,20 +34,61 @@ export function TextLink({
2734
trailingIcon,
2835
trailingIconClassName,
2936
variant = "primary",
37+
shortcut,
38+
hideShortcutKey,
39+
tooltip,
3040
...props
3141
}: TextLinkProps) {
42+
const innerRef = useRef<HTMLAnchorElement>(null);
3243
const classes = variations[variant];
33-
return to ? (
34-
<Link to={to} className={cn(classes, className)} {...props}>
44+
45+
if (shortcut) {
46+
useShortcutKeys({
47+
shortcut: shortcut,
48+
action: () => {
49+
if (innerRef.current) {
50+
innerRef.current.click();
51+
}
52+
},
53+
});
54+
}
55+
56+
const renderShortcutKey = () =>
57+
shortcut &&
58+
!hideShortcutKey && <ShortcutKey className="ml-1.5" shortcut={shortcut} variant="small" />;
59+
60+
const linkContent = (
61+
<>
3562
{children}{" "}
3663
{trailingIcon && <Icon icon={trailingIcon} className={cn("size-4", trailingIconClassName)} />}
64+
{shortcut && !tooltip && renderShortcutKey()}
65+
</>
66+
);
67+
68+
const linkElement = to ? (
69+
<Link ref={innerRef} to={to} className={cn(classes, className)} {...props}>
70+
{linkContent}
3771
</Link>
3872
) : href ? (
39-
<a href={href} className={cn(classes, className)} {...props}>
40-
{children}{" "}
41-
{trailingIcon && <Icon icon={trailingIcon} className={cn("size-4", trailingIconClassName)} />}
73+
<a ref={innerRef} href={href} className={cn(classes, className)} {...props}>
74+
{linkContent}
4275
</a>
4376
) : (
4477
<span>Need to define a path or href</span>
4578
);
79+
80+
if (tooltip) {
81+
return (
82+
<TooltipProvider>
83+
<Tooltip>
84+
<TooltipTrigger asChild>{linkElement}</TooltipTrigger>
85+
<TooltipContent className="text-dimmed flex items-center gap-3 py-1.5 pl-2.5 pr-3 text-xs">
86+
{tooltip} {shortcut && renderShortcutKey()}
87+
</TooltipContent>
88+
</Tooltip>
89+
</TooltipProvider>
90+
);
91+
}
92+
93+
return linkElement;
4694
}

‎apps/webapp/app/presenters/v3/RunPresenter.server.ts‎

Lines changed: 9 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import { millisecondsToNanoseconds } from "@trigger.dev/core/v3";
22
import { createTreeFromFlatItems, flattenTree } from "~/components/primitives/TreeView/TreeView";
3-
import { prisma, PrismaClient } from "~/db.server";
3+
import { prisma, type PrismaClient } from "~/db.server";
44
import { createTimelineSpanEventsFromSpanEvents } from "~/utils/timelineSpanEvents";
55
import { getUsername } from "~/utils/username";
66
import { eventRepository } from "~/v3/eventRepository.server";
@@ -58,7 +58,13 @@ export class RunPresenter {
5858
rootTaskRun: {
5959
select: {
6060
friendlyId: true,
61-
taskIdentifier: true,
61+
spanId: true,
62+
createdAt: true,
63+
},
64+
},
65+
parentTaskRun: {
66+
select: {
67+
friendlyId: true,
6268
spanId: true,
6369
createdAt: true,
6470
},
@@ -111,6 +117,7 @@ export class RunPresenter {
111117
completedAt: run.completedAt,
112118
logsDeletedAt: showDeletedLogs ? null : run.logsDeletedAt,
113119
rootTaskRun: run.rootTaskRun,
120+
parentTaskRun: run.parentTaskRun,
114121
environment: {
115122
id: run.runtimeEnvironment.id,
116123
organizationId: run.runtimeEnvironment.organizationId,
@@ -202,8 +209,6 @@ export class RunPresenter {
202209
trace: {
203210
rootSpanStatus,
204211
events: events,
205-
parentRunFriendlyId:
206-
tree?.id === traceSummary.rootSpan.id ? undefined : traceSummary.rootSpan.runId,
207212
duration: totalDuration,
208213
rootStartedAt: tree?.data.startTime,
209214
startedAt: run.startedAt,

0 commit comments

Comments
 (0)