github-featured/triggerdotdev--trigger.dev
2
0
Fork 0
Code Issues Pull Requests Deployments Models Agent Notes Packages Projects Releases Wiki Activity

Fixed node header text alignment

Browse Source
This commit is contained in:
James Ritchie
2022-12-20 11:57:04 +00:00
parent 65553a40c8
commit 9155df3cf5
1 changed files with 36 additions and 36 deletions
Download Patch File Download Diff File Expand all files Collapse all files
apps/webapp/app/routes/__app/orgs/$organizationSlug/workflows/$workflowSlug/runs/$runId.tsx
+36 -36
View File
@@ -172,7 +172,7 @@ export default function Page() {
);
}
const workflowNodeFlexClasses = "flex gap-1 items-center";
const workflowNodeFlexClasses = "flex gap-1 items-baseline";
const workflowNodeUppercaseClasses = "uppercase text-slate-400";
function WorkflowStep({ step }: { step: Step }) {
@@ -192,6 +192,41 @@ function WorkflowStep({ step }: { step: Step }) {
);
}
function StepHeader({ step }: { step: Step }) {
return (
<div className="flex mb-4 pb-3 justify-between items-center border-b border-slate-700">
<ul className="flex gap-4 items-center">
<li className="flex gap-1 items-center">
<StepIcon step={step} />
<Body size="small">{stepTitle(step)}</Body>
</li>
{step.startedAt && (
<li className={workflowNodeFlexClasses}>
<Body size="extra-small" className={workflowNodeUppercaseClasses}>
Started:
</Body>
<Body size="small">{formatDateTime(step.startedAt)}</Body>
</li>
)}
{step.completedAt && (
<li className={workflowNodeFlexClasses}>
<Body size="extra-small" className={workflowNodeUppercaseClasses}>
Completed:
</Body>
<Body size="small">{formatDateTime(step.completedAt)}</Body>
</li>
)}
</ul>
{step.type === "trigger" && step.trigger.on === "webhook" ? (
<div className="flex gap-2 items-center">
<Body size="small">{step.trigger.integration}</Body>
<img src={githubLogo} alt="GitHub" className="h-8 shadow" />
</div>
) : null}
</div>
);
}
function StepBody({ step }: { step: Step }) {
switch (step.type) {
case "trigger":
@@ -270,41 +305,6 @@ function StepError({ step }: { step: Step }) {
);
}
function StepHeader({ step }: { step: Step }) {
return (
<div className="flex mb-4 pb-3 justify-between items-center border-b border-slate-700">
<ul className="flex gap-4 items-center">
<li className={workflowNodeFlexClasses}>
<StepIcon step={step} />
<Body size="small">{stepTitle(step)}</Body>
</li>
{step.startedAt && (
<li className={workflowNodeFlexClasses}>
<Body size="extra-small" className={workflowNodeUppercaseClasses}>
Started:
</Body>
<Body size="small">{formatDateTime(step.startedAt)}</Body>
</li>
)}
{step.completedAt && (
<li className={workflowNodeFlexClasses}>
<Body size="extra-small" className={workflowNodeUppercaseClasses}>
Completed:
</Body>
<Body size="small">{formatDateTime(step.completedAt)}</Body>
</li>
)}
</ul>
{step.type === "trigger" && step.trigger.on === "webhook" ? (
<div className="flex gap-2 items-center">
<Body size="small">{step.trigger.integration}</Body>
<img src={githubLogo} alt="GitHub" className="h-8 shadow" />
</div>
) : null}
</div>
);
}
function Status({ status }: { status: WorkflowStepStatus }) {
switch (status) {
case "error":