No Tasks in a Run warning message (#688)

* Card hover state is now grey

* Added a callout warning if you don’t have any tasks

* Conditionally show the no-task warning at the top of the run

* New job to test the no-task warning message

* Created a new example Job for the CLI that uses Tasks

* Updated the Next.js cli joke job

* Updated the Remix app cli job example

* Updated the Astro app cli job example

* Made sure the example job works in remix

* Added changeset

---------

Co-authored-by: Eric Allam <eric@trigger.dev>
This commit is contained in:
James Ritchie
2023-10-30 16:24:46 +00:00
committed by GitHub
parent 9c4be40adc
commit 0876b87526
10 changed files with 168 additions and 24 deletions
+5
View File
@@ -0,0 +1,5 @@
---
"@trigger.dev/cli": patch
---
Added new example job which uses Tasks
+1 -1
View File
@@ -36,7 +36,7 @@ export function RunPanel({
? "border-slate-850"
: "border-slate-900",
onClick && "cursor-pointer",
onClick && !selected && "hover:border-green-500/30",
onClick && !selected && "hover:border-slate-500/30",
className
)}
onClick={() => onClick && onClick()}
@@ -159,6 +159,16 @@ export function RunOverview({ run, trigger, showRerun, paths }: RunOverviewProps
<div className="grid h-full grid-cols-2 gap-2">
<div className="flex flex-col gap-6 overflow-y-auto py-4 pl-4 pr-2 scrollbar-thin scrollbar-track-transparent scrollbar-thumb-slate-700">
<div>
{(run.tasks.length === 0 || run.tasks.every((t) => t.noop)) && (
<Callout
variant={"warning"}
to="https://trigger.dev/docs/documentation/concepts/tasks"
className="mb-4"
>
This Run completed but it did not use any Tasks this can cause unpredictable
results. Read the docs to view the solution.
</Callout>
)}
<Header2 className="mb-2">Trigger</Header2>
<RunPanel
selected={selectedId === "trigger"}
@@ -156,6 +156,7 @@ export class RunPresenter {
completedAt: true,
style: true,
parentId: true,
noop: true,
runConnection: {
select: {
integration: {
+24 -7
View File
@@ -2,9 +2,9 @@ import { eventTrigger } from "@trigger.dev/sdk";
import { client } from "${jobsPathPrefix}trigger";
// Your first job
// This Job will be triggered by an event, log a joke to the console, and then wait 5 seconds before logging the punchline
// This Job will be triggered by an event, log a joke to the console, and then wait 5 seconds before logging the punchline.
client.defineJob({
// This is the unique identifier for your Job, it must be unique across all Jobs in your project
// This is the unique identifier for your Job, it must be unique across all Jobs in your project.
id: "example-job",
name: "Example Job: a joke with a delay",
version: "0.0.1",
@@ -13,12 +13,29 @@ client.defineJob({
name: "example.event",
}),
run: async (payload, io, ctx) => {
// This logs a message to the console
await io.logger.info("🧪 Example Job: a joke with a delay");
await io.logger.info("How do you comfort a JavaScript bug?");
// This waits for 5 seconds, the second parameter is the number of seconds to wait, you can add delays of up to a year
// Use a Task to generate a random number. Using a Tasks means it only runs once.
const result = await io.runTask("generate-random-number", async () => {
return {
num: Math.floor(Math.random() * 10000),
};
});
// Use the random number in a joke and log it to the console.
await io.logger.info(`Why was the number ${result.num} afraid of the number 7?`);
// Wait for 5 seconds, the second parameter is the number of seconds to wait, you can add delays of up to a year.
await io.wait("Wait 5 seconds for the punchline...", 5);
await io.logger.info("You console it! 🤦");
// Use a Task to display the answer. Tasks are important to use in all Jobs as they allow your Runs to resume again after e.g. a serverless function timeout. Learn more about Tasks in the docs: https://trigger.dev/docs/documentation/concepts/tasks
await io.runTask(
"task-example",
async () => {
return {
foo: "bar",
};
},
{ name: `Answer: Because 7,8,9! And ${result.num} was next 🤦` }
);
await io.logger.info(
"✨ Congratulations, You just ran your first successful Trigger.dev Job! ✨"
);
@@ -2,9 +2,9 @@ import { eventTrigger } from "@trigger.dev/sdk";
import { client } from "${jobsPathPrefix}trigger";
// Your first job
// This Job will be triggered by an event, log a joke to the console, and then wait 5 seconds before logging the punchline
// This Job will be triggered by an event, log a joke to the console, and then wait 5 seconds before logging the punchline.
client.defineJob({
// This is the unique identifier for your Job, it must be unique across all Jobs in your project
// This is the unique identifier for your Job, it must be unique across all Jobs in your project.
id: "example-job",
name: "Example Job: a joke with a delay",
version: "0.0.1",
@@ -13,15 +13,32 @@ client.defineJob({
name: "example.event",
}),
run: async (payload, io, ctx) => {
// This logs a message to the console
await io.logger.info("🧪 Example Job: a joke with a delay");
await io.logger.info("How do you comfort a JavaScript bug?");
// This waits for 5 seconds, the second parameter is the number of seconds to wait, you can add delays of up to a year
// Use a Task to generate a random number. Using a Tasks means it only runs once.
const result = await io.runTask("generate-random-number", async () => {
return {
num: Math.floor(Math.random() * 10000),
};
});
// Use the random number in a joke and log it to the console.
await io.logger.info(`Why was the number ${result.num} afraid of the number 7?`);
// Wait for 5 seconds, the second parameter is the number of seconds to wait, you can add delays of up to a year.
await io.wait("Wait 5 seconds for the punchline...", 5);
await io.logger.info("You console it! 🤦");
// Use a Task to display the answer. Tasks are important to use in all Jobs as they allow your Runs to resume again after e.g. a serverless function timeout. Learn more about Tasks in the docs: https://trigger.dev/docs/documentation/concepts/tasks
await io.runTask(
"task-example",
async () => {
return {
foo: "bar",
};
},
{ name: `Answer: Because 7,8,9! And ${result.num} was next 🤦` }
);
await io.logger.info(
"✨ Congratulations, You just ran your first successful Trigger.dev Job! ✨"
);
// To learn how to write much more complex (and probably funnier) Jobs, check out our docs: https://trigger.dev/docs/documentation/guides/create-a-job
},
});
});
+24 -7
View File
@@ -2,9 +2,9 @@ import { eventTrigger } from "@trigger.dev/sdk";
import { client } from "${jobsPathPrefix}trigger.server";
// Your first job
// This Job will be triggered by an event, log a joke to the console, and then wait 5 seconds before logging the punchline
// This Job will be triggered by an event, log a joke to the console, and then wait 5 seconds before logging the punchline.
export const job = client.defineJob({
// This is the unique identifier for your Job, it must be unique across all Jobs in your project
// This is the unique identifier for your Job, it must be unique across all Jobs in your project.
id: "example-job",
name: "Example Job: a joke with a delay",
version: "0.0.1",
@@ -13,12 +13,29 @@ export const job = client.defineJob({
name: "example.event",
}),
run: async (payload, io, ctx) => {
// This logs a message to the console
await io.logger.info("🧪 Example Job: a joke with a delay");
await io.logger.info("How do you comfort a JavaScript bug?");
// This waits for 5 seconds, the second parameter is the number of seconds to wait, you can add delays of up to a year
// Use a Task to generate a random number. Using a Tasks means it only runs once.
const result = await io.runTask("generate-random-number", async () => {
return {
num: Math.floor(Math.random() * 10000),
};
});
// Use the random number in a joke and log it to the console.
await io.logger.info(`Why was the number ${result.num} afraid of the number 7?`);
// Wait for 5 seconds, the second parameter is the number of seconds to wait, you can add delays of up to a year.
await io.wait("Wait 5 seconds for the punchline...", 5);
await io.logger.info("You console it! 🤦");
// Use a Task to display the answer. Tasks are important to use in all Jobs as they allow your Runs to resume again after e.g. a serverless function timeout. Learn more about Tasks in the docs: https://trigger.dev/docs/documentation/concepts/tasks
await io.runTask(
"task-example",
async () => {
return {
foo: "bar",
};
},
{ name: `Answer: Because 7,8,9! And ${result.num} was next 🤦` }
);
await io.logger.info(
"✨ Congratulations, You just ran your first successful Trigger.dev Job! ✨"
);
+2 -1
View File
@@ -28,6 +28,7 @@
"replicate": "nodemon --watch src/replicate.ts -r tsconfig-paths/register -r dotenv/config src/replicate.ts",
"misconfigured": "nodemon --watch src/misconfigured.ts -r tsconfig-paths/register -r dotenv/config src/misconfigured.ts",
"auto-yield": "nodemon --watch src/auto-yield.ts -r tsconfig-paths/register -r dotenv/config src/auto-yield.ts",
"cli-example": "nodemon --watch src/cli-example.ts -r tsconfig-paths/register -r dotenv/config src/cli-example.ts",
"dev:trigger": "trigger-cli dev --port 8080"
},
"dependencies": {
@@ -62,4 +63,4 @@
"ts-node": "^10.9.1",
"tsconfig-paths": "^3.14.1"
}
}
}
+54
View File
@@ -0,0 +1,54 @@
import { createExpressServer } from "@trigger.dev/express";
import { TriggerClient, eventTrigger } from "@trigger.dev/sdk";
export const client = new TriggerClient({
id: "job-catalog",
apiKey: process.env["TRIGGER_API_KEY"],
apiUrl: process.env["TRIGGER_API_URL"],
verbose: false,
ioLogLocalEnabled: true,
});
// Your first job
// This Job will be triggered by an event, log a joke to the console, and then wait 5 seconds before logging the punchline.
client.defineJob({
// This is the unique identifier for your Job, it must be unique across all Jobs in your project.
id: "example-job",
name: "Example Job: a joke with a delay",
version: "0.0.1",
// This is triggered by an event using eventTrigger. You can also trigger Jobs with webhooks, on schedules, and more: https://trigger.dev/docs/documentation/concepts/triggers/introduction
trigger: eventTrigger({
name: "example.event",
}),
run: async (payload, io, ctx) => {
// Use a Task to generate a random number. Using a Tasks means it only runs once.
const result = await io.runTask("generate-random-number", async () => {
return {
num: Math.floor(Math.random() * 10000),
};
});
// Use the random number in a joke and log it to the console.
await io.logger.info(`Why was the number ${result.num} afraid of the number 7?`);
// Wait for 5 seconds, the second parameter is the number of seconds to wait, you can add delays of up to a year.
await io.wait("Wait 5 seconds for the punchline...", 5);
// Use a Task to display the answer. Tasks are important to use in all Jobs as they allow your Runs to resume again after e.g. a serverless function timeout. Learn more about Tasks in the docs: https://trigger.dev/docs/documentation/concepts/tasks
await io.runTask(
"task-example",
async () => {
return {
foo: "bar",
};
},
{ name: `Answer: Because 7,8,9! And ${result.num} was next 🤦` }
);
await io.logger.info(
"✨ Congratulations, You just ran your first successful Trigger.dev Job! ✨"
);
// To learn how to write much more complex (and probably funnier) Jobs, check out our docs: https://trigger.dev/docs/documentation/guides/create-a-job
},
});
createExpressServer(client);
+22
View File
@@ -77,6 +77,28 @@ client.defineJob({
},
});
client.defineJob({
id: "no-real-task",
name: "No real Task",
version: "0.0.1",
trigger: eventTrigger({
name: "no.real.task",
schema: z.object({
userId: z.string(),
}),
}),
run: async (payload, io, ctx) => {
await io.logger.info("Hello World", { ctx, payload });
await io.wait("Wait 1 sec", 1);
//this is a real task
// await io.runTask("task-example-1", async () => {
// return {
// message: "Hello World",
// };
// });
}
});
client.defineJob({
id: "cancel-runs-example",
name: "Cancel Runs Example",