Skip to content

Commit 0210604

Browse files
mpcgridmpcgrid
authored
Merge branch 'main' into feat/tri-6733-reset-an-idempotencykey
2 parents dda38b7 + d287078 commit 0210604

File tree

23 files changed

+2155
-960
lines changed

23 files changed

+2155
-960
lines changed

‎.changeset/great-pillows-look.md‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
---
2+
"trigger.dev": minor
3+
---
4+
5+
feat(cli): enable zstd compression for deployment images

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

Lines changed: 148 additions & 132 deletions
Original file line numberDiff line numberDiff line change
@@ -52,6 +52,13 @@ import {
5252
} from "./SetupCommands";
5353
import { StepContentContainer } from "./StepContentContainer";
5454
import { V4Badge } from "./V4Badge";
55+
import {
56+
ClientTabs,
57+
ClientTabsContent,
58+
ClientTabsList,
59+
ClientTabsTrigger,
60+
} from "./primitives/ClientTabs";
61+
import { GitHubSettingsPanel } from "~/routes/resources.orgs.$organizationSlug.projects.$projectParam.env.$envParam.github";
5562

5663
export function HasNoTasksDev() {
5764
return (
@@ -93,62 +100,7 @@ export function HasNoTasksDev() {
93100
}
94101

95102
export function HasNoTasksDeployed({ environment }: { environment: MinimumEnvironment }) {
96-
return (
97-
<PackageManagerProvider>
98-
<div>
99-
<div className="mb-6 flex items-center justify-between border-b">
100-
<div className="mb-2 flex items-center gap-2">
101-
<EnvironmentIcon environment={environment} className="-ml-1 size-8" />
102-
<Header1>Deploy your tasks to {environmentFullTitle(environment)}</Header1>
103-
</div>
104-
<div className="flex items-center">
105-
<SimpleTooltip
106-
button={
107-
<LinkButton
108-
variant="small-menu-item"
109-
LeadingIcon={BookOpenIcon}
110-
leadingIconClassName="text-blue-500"
111-
to={docsPath("deployment/overview")}
112-
/>
113-
}
114-
content="Deploy docs"
115-
/>
116-
<SimpleTooltip
117-
button={
118-
<LinkButton
119-
variant="small-menu-item"
120-
LeadingIcon={QuestionMarkCircleIcon}
121-
leadingIconClassName="text-blue-500"
122-
to={docsPath("troubleshooting#deployment")}
123-
/>
124-
}
125-
content="Troubleshooting docs"
126-
/>
127-
<AskAI />
128-
</div>
129-
</div>
130-
<StepNumber stepNumber="1a" title="Run the CLI 'deploy' command" />
131-
<StepContentContainer>
132-
<Paragraph spacing>
133-
This will deploy your tasks to the {environmentFullTitle(environment)} environment. Read
134-
the <TextLink to={docsPath("deployment/overview")}>full guide</TextLink>.
135-
</Paragraph>
136-
<TriggerDeployStep environment={environment} />
137-
</StepContentContainer>
138-
<StepNumber stepNumber="1b" title="Or deploy using GitHub Actions" />
139-
<StepContentContainer>
140-
<Paragraph spacing>
141-
Read the <TextLink to={docsPath("github-actions")}>GitHub Actions guide</TextLink> to
142-
get started.
143-
</Paragraph>
144-
</StepContentContainer>
145-
<StepNumber stepNumber="2" title="Waiting for tasks to deploy" displaySpinner />
146-
<StepContentContainer>
147-
<Paragraph>This page will automatically refresh when your tasks are deployed.</Paragraph>
148-
</StepContentContainer>
149-
</div>
150-
</PackageManagerProvider>
151-
);
103+
return <DeploymentOnboardingSteps />;
152104
}
153105

154106
export function SchedulesNoPossibleTaskPanel() {
@@ -266,45 +218,7 @@ export function TestHasNoTasks() {
266218
}
267219

268220
export function DeploymentsNone() {
269-
const organization = useOrganization();
270-
const project = useProject();
271-
const environment = useEnvironment();
272-
273-
return (
274-
<InfoPanel
275-
icon={ServerStackIcon}
276-
iconClassName="text-deployments"
277-
title="Deploy for the first time"
278-
panelClassName="max-w-full"
279-
>
280-
<Paragraph spacing variant="small">
281-
There are several ways to deploy your tasks. You can use the CLI or a Continuous Integration
282-
service like GitHub Actions. Make sure you{" "}
283-
<TextLink href={v3EnvironmentVariablesPath(organization, project, environment)}>
284-
set your environment variables
285-
</TextLink>{" "}
286-
first.
287-
</Paragraph>
288-
<div className="flex gap-3">
289-
<LinkButton
290-
to={docsPath("v3/cli-deploy")}
291-
variant="docs/medium"
292-
LeadingIcon={BookOpenIcon}
293-
className="inline-flex"
294-
>
295-
Deploy with the CLI
296-
</LinkButton>
297-
<LinkButton
298-
to={docsPath("v3/github-actions")}
299-
variant="docs/medium"
300-
LeadingIcon={BookOpenIcon}
301-
className="inline-flex"
302-
>
303-
Deploy with GitHub actions
304-
</LinkButton>
305-
</div>
306-
</InfoPanel>
307-
);
221+
return <DeploymentOnboardingSteps />;
308222
}
309223

310224
export function DeploymentsNoneDev() {
@@ -313,46 +227,52 @@ export function DeploymentsNoneDev() {
313227
const environment = useEnvironment();
314228

315229
return (
316-
<div className="space-y-8">
317-
<InfoPanel
318-
icon={ServerStackIcon}
319-
iconClassName="text-deployments"
320-
title="Deploying tasks"
321-
panelClassName="max-w-full"
322-
>
323-
<Paragraph spacing variant="small">
230+
<>
231+
<div className="mb-6 flex items-center justify-between border-b">
232+
<div className="mb-2 flex items-center gap-2">
233+
<EnvironmentIcon environment={environment} className="-ml-1 size-8" />
234+
<Header1>Deploy your tasks</Header1>
235+
</div>
236+
<div className="flex items-center">
237+
<SimpleTooltip
238+
button={
239+
<LinkButton
240+
variant="small-menu-item"
241+
LeadingIcon={BookOpenIcon}
242+
leadingIconClassName="text-blue-500"
243+
to={docsPath("deployment/overview")}
244+
/>
245+
}
246+
content="Deploy docs"
247+
/>
248+
<SimpleTooltip
249+
button={
250+
<LinkButton
251+
variant="small-menu-item"
252+
LeadingIcon={QuestionMarkCircleIcon}
253+
leadingIconClassName="text-blue-500"
254+
to={docsPath("troubleshooting#deployment")}
255+
/>
256+
}
257+
content="Troubleshooting docs"
258+
/>
259+
<AskAI />
260+
</div>
261+
</div>
262+
<StepNumber stepNumber="→" title="Switch to a deployed environment" />
263+
<StepContentContainer className="mb-4 flex flex-col gap-4">
264+
<Paragraph>
324265
This is the Development environment. When you're ready to deploy your tasks, switch to a
325266
different environment.
326267
</Paragraph>
327-
<Paragraph spacing variant="small">
328-
There are several ways to deploy your tasks. You can use the CLI or a Continuous
329-
Integration service like GitHub Actions. Make sure you{" "}
330-
<TextLink href={v3EnvironmentVariablesPath(organization, project, environment)}>
331-
set your environment variables
332-
</TextLink>{" "}
333-
first.
334-
</Paragraph>
335-
<div className="flex gap-3">
336-
<LinkButton
337-
to={docsPath("v3/cli-deploy")}
338-
variant="docs/medium"
339-
LeadingIcon={BookOpenIcon}
340-
className="inline-flex"
341-
>
342-
Deploy with the CLI
343-
</LinkButton>
344-
<LinkButton
345-
to={docsPath("v3/github-actions")}
346-
variant="docs/medium"
347-
LeadingIcon={BookOpenIcon}
348-
className="inline-flex"
349-
>
350-
Deploy with GitHub actions
351-
</LinkButton>
352-
</div>
353-
</InfoPanel>
354-
<SwitcherPanel />
355-
</div>
268+
<EnvironmentSelector
269+
organization={organization}
270+
project={project}
271+
environment={environment}
272+
className="w-fit border border-charcoal-600 bg-secondary hover:border-charcoal-550 hover:bg-charcoal-600"
273+
/>
274+
</StepContentContainer>
275+
</>
356276
);
357277
}
358278

@@ -670,3 +590,99 @@ export function BulkActionsNone() {
670590
</div>
671591
);
672592
}
593+
594+
function DeploymentOnboardingSteps() {
595+
const environment = useEnvironment();
596+
const organization = useOrganization();
597+
const project = useProject();
598+
599+
return (
600+
<PackageManagerProvider>
601+
<div className="mb-2 flex items-center justify-between border-b">
602+
<div className="mb-2 flex items-center gap-2">
603+
<EnvironmentIcon environment={environment} className="-ml-1 size-8" />
604+
<Header1>Deploy your tasks to {environmentFullTitle(environment)}</Header1>
605+
</div>
606+
<div className="flex items-center">
607+
<SimpleTooltip
608+
button={
609+
<LinkButton
610+
variant="small-menu-item"
611+
LeadingIcon={BookOpenIcon}
612+
leadingIconClassName="text-blue-500"
613+
to={docsPath("deployment/overview")}
614+
/>
615+
}
616+
content="Deploy docs"
617+
/>
618+
<SimpleTooltip
619+
button={
620+
<LinkButton
621+
variant="small-menu-item"
622+
LeadingIcon={QuestionMarkCircleIcon}
623+
leadingIconClassName="text-blue-500"
624+
to={docsPath("troubleshooting#deployment")}
625+
/>
626+
}
627+
content="Troubleshooting docs"
628+
/>
629+
<AskAI />
630+
</div>
631+
</div>
632+
<ClientTabs defaultValue="github">
633+
<ClientTabsList variant="segmented" className="mb-6">
634+
<ClientTabsTrigger value={"github"} variant="segmented" layoutId="deploy-tabs">
635+
GitHub
636+
</ClientTabsTrigger>
637+
<ClientTabsTrigger value={"cli"} variant="segmented" layoutId="deploy-tabs">
638+
Manual
639+
</ClientTabsTrigger>
640+
<ClientTabsTrigger value={"github-actions"} variant="segmented" layoutId="deploy-tabs">
641+
GitHub Actions
642+
</ClientTabsTrigger>
643+
</ClientTabsList>
644+
<ClientTabsContent value={"github"}>
645+
<StepNumber stepNumber="1" title="Connect your GitHub repository" />
646+
<StepContentContainer>
647+
<Paragraph spacing>
648+
Deploy automatically with every push. Read the{" "}
649+
<TextLink to={docsPath("github-integration")}>full guide</TextLink>.
650+
</Paragraph>
651+
<div className="w-fit">
652+
<GitHubSettingsPanel
653+
organizationSlug={organization.slug}
654+
projectSlug={project.slug}
655+
environmentSlug={environment.slug}
656+
billingPath={v3BillingPath({ slug: organization.slug })}
657+
/>
658+
</div>
659+
</StepContentContainer>
660+
</ClientTabsContent>
661+
<ClientTabsContent value={"cli"}>
662+
<StepNumber stepNumber="1" title="Run the CLI 'deploy' command" />
663+
<StepContentContainer>
664+
<Paragraph spacing>
665+
This will deploy your tasks to the {environmentFullTitle(environment)} environment.
666+
Read the <TextLink to={docsPath("deployment/overview")}>full guide</TextLink>.
667+
</Paragraph>
668+
<TriggerDeployStep environment={environment} />
669+
</StepContentContainer>
670+
</ClientTabsContent>
671+
<ClientTabsContent value={"github-actions"}>
672+
<StepNumber stepNumber="1" title="Deploy using GitHub Actions" />
673+
<StepContentContainer>
674+
<Paragraph spacing>
675+
Read the <TextLink to={docsPath("github-actions")}>GitHub Actions guide</TextLink> to
676+
get started.
677+
</Paragraph>
678+
</StepContentContainer>
679+
</ClientTabsContent>
680+
</ClientTabs>
681+
682+
<StepNumber stepNumber="2" title="Waiting for tasks to deploy" displaySpinner />
683+
<StepContentContainer>
684+
<Paragraph>This page will automatically refresh when your tasks are deployed.</Paragraph>
685+
</StepContentContainer>
686+
</PackageManagerProvider>
687+
);
688+
}

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

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -134,6 +134,10 @@ function ShortcutContent() {
134134
<ShortcutKey shortcut={{ key: "arrowleft" }} variant="medium/bright" />
135135
<ShortcutKey shortcut={{ key: "arrowright" }} variant="medium/bright" />
136136
</Shortcut>
137+
<Shortcut name="Jump to adjacent">
138+
<ShortcutKey shortcut={{ key: "[" }} variant="medium/bright" />
139+
<ShortcutKey shortcut={{ key: "]" }} variant="medium/bright" />
140+
</Shortcut>
137141
<Shortcut name="Expand all">
138142
<ShortcutKey shortcut={{ key: "e" }} variant="medium/bright" />
139143
</Shortcut>

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

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -372,7 +372,7 @@ export const LinkButton = ({
372372
<ExtLink
373373
href={to.toString()}
374374
ref={innerRef}
375-
className={cn("group/button focus-custom", props.fullWidth ? "w-full" : "")}
375+
className={cn("group/button block focus-custom", props.fullWidth ? "w-full" : "")}
376376
onClick={onClick}
377377
onMouseDown={onMouseDown}
378378
onMouseEnter={onMouseEnter}
@@ -387,7 +387,7 @@ export const LinkButton = ({
387387
<Link
388388
to={to}
389389
ref={innerRef}
390-
className={cn("group/button focus-custom", props.fullWidth ? "w-full" : "")}
390+
className={cn("group/button block focus-custom", props.fullWidth ? "w-full" : "")}
391391
onClick={onClick}
392392
onMouseDown={onMouseDown}
393393
onMouseEnter={onMouseEnter}
@@ -408,7 +408,7 @@ export const NavLinkButton = ({ to, className, target, ...props }: NavLinkPropsT
408408
return (
409409
<NavLink
410410
to={to}
411-
className={cn("group/button outline-none", props.fullWidth ? "w-full" : "")}
411+
className={cn("group/button outline-none block", props.fullWidth ? "w-full" : "")}
412412
target={target}
413413
>
414414
{({ isActive, isPending }) => (

0 commit comments

Comments
 (0)