v3 pages have page titles (#1582)

samejr · web-flow · commit c855e4a96c7c · 2025-01-21T12:07:32.000Z
* Adds tasks page title

* Adds page titles to the &lt;head&gt;
diff --git a/apps/webapp/app/routes/_app.orgs.$organizationSlug._index/route.tsx b/apps/webapp/app/routes/_app.orgs.$organizationSlug._index/route.tsx
@@ -1,21 +1,22 @@
-import { Link } from "@remix-run/react";
-import simplur from "simplur";
+import { Link, MetaFunction } from "@remix-run/react";
 import { PageBody, PageContainer } from "~/components/layout/AppLayout";
 import { Badge } from "~/components/primitives/Badge";
 import { LinkButton } from "~/components/primitives/Buttons";
 import { Header3 } from "~/components/primitives/Headers";
 import { NamedIcon } from "~/components/primitives/NamedIcon";
-import {
-  PageAccessories,
-  NavBar,
-  PageInfoGroup,
-  PageInfoRow,
-  PageTitle,
-} from "~/components/primitives/PageHeader";
+import { NavBar, PageAccessories, PageTitle } from "~/components/primitives/PageHeader";
 import { Paragraph } from "~/components/primitives/Paragraph";
 import { useOrganization } from "~/hooks/useOrganizations";
 import { newProjectPath, projectPath } from "~/utils/pathBuilder";
 
+export const meta: MetaFunction = () => {
+  return [
+    {
+      title: "Projects | Trigger.dev",
+    },
+  ];
+};
+
 export default function Page() {
   const organization = useOrganization();
 
diff --git a/apps/webapp/app/routes/_app.orgs.$organizationSlug.projects.v3.$projectParam._index/route.tsx b/apps/webapp/app/routes/_app.orgs.$organizationSlug.projects.v3.$projectParam._index/route.tsx
@@ -8,7 +8,7 @@ import {
   UserPlusIcon,
   VideoCameraIcon,
 } from "@heroicons/react/20/solid";
-import { json } from "@remix-run/node";
+import { json, type MetaFunction } from "@remix-run/node";
 import { Link, useRevalidator, useSubmit } from "@remix-run/react";
 import { ActionFunctionArgs, LoaderFunctionArgs } from "@remix-run/server-runtime";
 import { DiscordIcon } from "@trigger.dev/companyicons";
@@ -89,6 +89,14 @@ import {
   v3TestTaskPath,
 } from "~/utils/pathBuilder";
 
+export const meta: MetaFunction = () => {
+  return [
+    {
+      title: `Tasks | Trigger.dev`,
+    },
+  ];
+};
+
 export const loader = async ({ request, params }: LoaderFunctionArgs) => {
   const userId = await requireUserId(request);
   const { organizationSlug, projectParam } = ProjectParamSchema.parse(params);
diff --git a/apps/webapp/app/routes/_app.orgs.$organizationSlug.projects.v3.$projectParam.alerts/route.tsx b/apps/webapp/app/routes/_app.orgs.$organizationSlug.projects.v3.$projectParam.alerts/route.tsx
@@ -7,11 +7,10 @@ import {
   EnvelopeIcon,
   GlobeAltIcon,
   LockClosedIcon,
-  LockOpenIcon,
   PlusIcon,
   TrashIcon,
 } from "@heroicons/react/20/solid";
-import { Form, Outlet, useActionData, useNavigation } from "@remix-run/react";
+import { Form, MetaFunction, Outlet, useActionData, useNavigation } from "@remix-run/react";
 import { type ActionFunctionArgs, type LoaderFunctionArgs, json } from "@remix-run/server-runtime";
 import { SlackIcon } from "@trigger.dev/companyicons";
 import { type ProjectAlertChannelType, type ProjectAlertType } from "@trigger.dev/database";
@@ -24,7 +23,6 @@ import { Button, LinkButton } from "~/components/primitives/Buttons";
 import { ClipboardField } from "~/components/primitives/ClipboardField";
 import { DetailCell } from "~/components/primitives/DetailCell";
 import { Header2, Header3 } from "~/components/primitives/Headers";
-import { InfoPanel } from "~/components/primitives/InfoPanel";
 import { NavBar, PageAccessories, PageTitle } from "~/components/primitives/PageHeader";
 import { Paragraph } from "~/components/primitives/Paragraph";
 import {
@@ -63,6 +61,14 @@ import {
   v3ProjectAlertsPath,
 } from "~/utils/pathBuilder";
 
+export const meta: MetaFunction = () => {
+  return [
+    {
+      title: `Alerts | Trigger.dev`,
+    },
+  ];
+};
+
 export const loader = async ({ request, params }: LoaderFunctionArgs) => {
   const userId = await requireUserId(request);
   const { projectParam, organizationSlug } = ProjectParamSchema.parse(params);
diff --git a/apps/webapp/app/routes/_app.orgs.$organizationSlug.projects.v3.$projectParam.apikeys/route.tsx b/apps/webapp/app/routes/_app.orgs.$organizationSlug.projects.v3.$projectParam.apikeys/route.tsx
@@ -1,5 +1,6 @@
 import { BookOpenIcon, InformationCircleIcon, LockOpenIcon } from "@heroicons/react/20/solid";
 import { ArrowUpCircleIcon } from "@heroicons/react/24/outline";
+import { MetaFunction } from "@remix-run/react";
 import { LoaderFunctionArgs } from "@remix-run/server-runtime";
 import { typedjson, useTypedLoaderData } from "remix-typedjson";
 import { AdminDebugTooltip } from "~/components/admin/debugTooltip";
@@ -28,6 +29,14 @@ import { ApiKeysPresenter } from "~/presenters/v3/ApiKeysPresenter.server";
 import { requireUserId } from "~/services/session.server";
 import { ProjectParamSchema, docsPath, v3BillingPath } from "~/utils/pathBuilder";
 
+export const meta: MetaFunction = () => {
+  return [
+    {
+      title: `API keys | Trigger.dev`,
+    },
+  ];
+};
+
 export const loader = async ({ request, params }: LoaderFunctionArgs) => {
   const userId = await requireUserId(request);
   const { projectParam } = ProjectParamSchema.parse(params);
diff --git a/apps/webapp/app/routes/_app.orgs.$organizationSlug.projects.v3.$projectParam.batches/route.tsx b/apps/webapp/app/routes/_app.orgs.$organizationSlug.projects.v3.$projectParam.batches/route.tsx
@@ -4,7 +4,7 @@ import {
   ExclamationCircleIcon,
 } from "@heroicons/react/20/solid";
 import { BookOpenIcon } from "@heroicons/react/24/solid";
-import { useLocation, useNavigation } from "@remix-run/react";
+import { MetaFunction, useLocation, useNavigation } from "@remix-run/react";
 import { LoaderFunctionArgs } from "@remix-run/server-runtime";
 import { formatDuration } from "@trigger.dev/core/v3/utils/durations";
 import { typedjson, useTypedLoaderData } from "remix-typedjson";
@@ -50,6 +50,14 @@ import {
 import { requireUserId } from "~/services/session.server";
 import { docsPath, ProjectParamSchema, v3BatchRunsPath } from "~/utils/pathBuilder";
 
+export const meta: MetaFunction = () => {
+  return [
+    {
+      title: `Batches | Trigger.dev`,
+    },
+  ];
+};
+
 export const loader = async ({ request, params }: LoaderFunctionArgs) => {
   const userId = await requireUserId(request);
   const { projectParam, organizationSlug } = ProjectParamSchema.parse(params);
diff --git a/apps/webapp/app/routes/_app.orgs.$organizationSlug.projects.v3.$projectParam.concurrency/route.tsx b/apps/webapp/app/routes/_app.orgs.$organizationSlug.projects.v3.$projectParam.concurrency/route.tsx
@@ -3,7 +3,8 @@ import {
   BookOpenIcon,
   ChatBubbleLeftEllipsisIcon,
 } from "@heroicons/react/20/solid";
-import { Await } from "@remix-run/react";
+import { LockOpenIcon } from "@heroicons/react/24/solid";
+import { Await, MetaFunction } from "@remix-run/react";
 import { type LoaderFunctionArgs } from "@remix-run/server-runtime";
 import { Suspense } from "react";
 import { typeddefer, useTypedLoaderData } from "remix-typedjson";
@@ -12,8 +13,8 @@ import { EnvironmentLabel } from "~/components/environments/EnvironmentLabel";
 import { Feedback } from "~/components/Feedback";
 import { PageBody, PageContainer } from "~/components/layout/AppLayout";
 import { Button, LinkButton } from "~/components/primitives/Buttons";
-import { Header2 } from "~/components/primitives/Headers";
 import { NavBar, PageAccessories, PageTitle } from "~/components/primitives/PageHeader";
+import { Paragraph } from "~/components/primitives/Paragraph";
 import { Spinner } from "~/components/primitives/Spinner";
 import {
   Table,
@@ -31,8 +32,14 @@ import {
 import { requireUserId } from "~/services/session.server";
 import { docsPath, ProjectParamSchema, v3BillingPath } from "~/utils/pathBuilder";
 import { useCurrentPlan } from "../_app.orgs.$organizationSlug/route";
-import { LockOpenIcon } from "@heroicons/react/24/solid";
-import { Paragraph } from "~/components/primitives/Paragraph";
+
+export const meta: MetaFunction = () => {
+  return [
+    {
+      title: `Concurrency limits | Trigger.dev`,
+    },
+  ];
+};
 
 export const loader = async ({ request, params }: LoaderFunctionArgs) => {
   const userId = await requireUserId(request);
diff --git a/apps/webapp/app/routes/_app.orgs.$organizationSlug.projects.v3.$projectParam.deployments/route.tsx b/apps/webapp/app/routes/_app.orgs.$organizationSlug.projects.v3.$projectParam.deployments/route.tsx
@@ -4,7 +4,7 @@ import {
   BookOpenIcon,
   ServerStackIcon,
 } from "@heroicons/react/20/solid";
-import { Outlet, useLocation, useParams } from "@remix-run/react";
+import { MetaFunction, Outlet, useLocation, useParams } from "@remix-run/react";
 import { LoaderFunctionArgs } from "@remix-run/server-runtime";
 import { typedjson, useTypedLoaderData } from "remix-typedjson";
 import { z } from "zod";
@@ -37,8 +37,8 @@ import {
 import { TextLink } from "~/components/primitives/TextLink";
 import {
   DeploymentStatus,
-  deploymentStatuses,
   deploymentStatusDescription,
+  deploymentStatuses,
 } from "~/components/runs/v3/DeploymentStatus";
 import { RetryDeploymentIndexingDialog } from "~/components/runs/v3/RetryDeploymentIndexingDialog";
 import { RollbackDeploymentDialog } from "~/components/runs/v3/RollbackDeploymentDialog";
@@ -50,7 +50,6 @@ import {
   DeploymentListPresenter,
 } from "~/presenters/v3/DeploymentListPresenter.server";
 import { requireUserId } from "~/services/session.server";
-import { cn } from "~/utils/cn";
 import {
   ProjectParamSchema,
   docsPath,
@@ -60,6 +59,14 @@ import {
 import { createSearchParams } from "~/utils/searchParams";
 import { deploymentIndexingIsRetryable } from "~/v3/deploymentStatus";
 
+export const meta: MetaFunction = () => {
+  return [
+    {
+      title: `Deployments | Trigger.dev`,
+    },
+  ];
+};
+
 const SearchParams = z.object({
   page: z.coerce.number().optional(),
 });
diff --git a/apps/webapp/app/routes/_app.orgs.$organizationSlug.projects.v3.$projectParam.environment-variables/route.tsx b/apps/webapp/app/routes/_app.orgs.$organizationSlug.projects.v3.$projectParam.environment-variables/route.tsx
@@ -9,7 +9,7 @@ import {
   TrashIcon,
 } from "@heroicons/react/20/solid";
 import { ArrowUpCircleIcon } from "@heroicons/react/24/outline";
-import { Form, Outlet, useActionData, useNavigation } from "@remix-run/react";
+import { Form, MetaFunction, Outlet, useActionData, useNavigation } from "@remix-run/react";
 import {
   ActionFunctionArgs,
   LoaderFunctionArgs,
@@ -69,6 +69,14 @@ import {
   EditEnvironmentVariable,
 } from "~/v3/environmentVariables/repository";
 
+export const meta: MetaFunction = () => {
+  return [
+    {
+      title: `Environment variables | Trigger.dev`,
+    },
+  ];
+};
+
 export const loader = async ({ request, params }: LoaderFunctionArgs) => {
   const userId = await requireUserId(request);
   const { projectParam } = ProjectParamSchema.parse(params);
diff --git a/apps/webapp/app/routes/_app.orgs.$organizationSlug.projects.v3.$projectParam.runs._index/route.tsx b/apps/webapp/app/routes/_app.orgs.$organizationSlug.projects.v3.$projectParam.runs._index/route.tsx
@@ -1,6 +1,6 @@
 import { ArrowPathIcon, StopCircleIcon } from "@heroicons/react/20/solid";
 import { BeakerIcon, BookOpenIcon } from "@heroicons/react/24/solid";
-import { Form, useNavigation } from "@remix-run/react";
+import { Form, MetaFunction, useNavigation } from "@remix-run/react";
 import { LoaderFunctionArgs } from "@remix-run/server-runtime";
 import { IconCircleX } from "@tabler/icons-react";
 import { AnimatePresence, motion } from "framer-motion";
@@ -53,6 +53,14 @@ import {
 } from "~/utils/pathBuilder";
 import { ListPagination } from "../../components/ListPagination";
 
+export const meta: MetaFunction = () => {
+  return [
+    {
+      title: `Runs | Trigger.dev`,
+    },
+  ];
+};
+
 export const loader = async ({ request, params }: LoaderFunctionArgs) => {
   const userId = await requireUserId(request);
   const { projectParam, organizationSlug } = ProjectParamSchema.parse(params);
diff --git a/apps/webapp/app/routes/_app.orgs.$organizationSlug.projects.v3.$projectParam.schedules/route.tsx b/apps/webapp/app/routes/_app.orgs.$organizationSlug.projects.v3.$projectParam.schedules/route.tsx
@@ -1,6 +1,6 @@
 import { ClockIcon, LockOpenIcon, PlusIcon, RectangleGroupIcon } from "@heroicons/react/20/solid";
 import { BookOpenIcon } from "@heroicons/react/24/solid";
-import { Outlet, useLocation, useParams } from "@remix-run/react";
+import { MetaFunction, Outlet, useLocation, useParams } from "@remix-run/react";
 import { LoaderFunctionArgs } from "@remix-run/server-runtime";
 import { typedjson, useTypedLoaderData } from "remix-typedjson";
 import { Feedback } from "~/components/Feedback";
@@ -66,6 +66,14 @@ import { useCurrentPlan } from "../_app.orgs.$organizationSlug/route";
 import { ArrowUpCircleIcon } from "@heroicons/react/24/outline";
 import { SimpleTooltip } from "~/components/primitives/Tooltip";
 
+export const meta: MetaFunction = () => {
+  return [
+    {
+      title: `Schedules | Trigger.dev`,
+    },
+  ];
+};
+
 export const loader = async ({ request, params }: LoaderFunctionArgs) => {
   const userId = await requireUserId(request);
   const { projectParam, organizationSlug } = ProjectParamSchema.parse(params);
diff --git a/apps/webapp/app/routes/_app.orgs.$organizationSlug.projects.v3.$projectParam.settings/route.tsx b/apps/webapp/app/routes/_app.orgs.$organizationSlug.projects.v3.$projectParam.settings/route.tsx
@@ -1,6 +1,6 @@
 import { conform, useForm } from "@conform-to/react";
 import { parse } from "@conform-to/zod";
-import { Form, useActionData, useNavigation } from "@remix-run/react";
+import { Form, MetaFunction, useActionData, useNavigation } from "@remix-run/react";
 import { ActionFunction, json } from "@remix-run/server-runtime";
 import { z } from "zod";
 import { AdminDebugTooltip } from "~/components/admin/debugTooltip";
@@ -24,6 +24,14 @@ import { redirectWithSuccessMessage } from "~/models/message.server";
 import { requireUserId } from "~/services/session.server";
 import { v3ProjectPath } from "~/utils/pathBuilder";
 
+export const meta: MetaFunction = () => {
+  return [
+    {
+      title: `Project settings | Trigger.dev`,
+    },
+  ];
+};
+
 export function createSchema(
   constraints: {
     getSlugMatch?: (slug: string) => { isMatch: boolean; projectSlug: string };
diff --git a/apps/webapp/app/routes/_app.orgs.$organizationSlug.projects.v3.$projectParam.test/route.tsx b/apps/webapp/app/routes/_app.orgs.$organizationSlug.projects.v3.$projectParam.test/route.tsx
@@ -1,5 +1,12 @@
 import { BookOpenIcon } from "@heroicons/react/20/solid";
-import { Link, Outlet, useLocation, useNavigation, useParams } from "@remix-run/react";
+import {
+  Link,
+  MetaFunction,
+  Outlet,
+  useLocation,
+  useNavigation,
+  useParams,
+} from "@remix-run/react";
 import { LoaderFunctionArgs } from "@remix-run/server-runtime";
 import { typedjson, useTypedLoaderData } from "remix-typedjson";
 import { z } from "zod";
@@ -47,6 +54,14 @@ import { requireUserId } from "~/services/session.server";
 import { cn } from "~/utils/cn";
 import { docsPath, ProjectParamSchema, v3TestPath, v3TestTaskPath } from "~/utils/pathBuilder";
 
+export const meta: MetaFunction = () => {
+  return [
+    {
+      title: `Test | Trigger.dev`,
+    },
+  ];
+};
+
 export const TestSearchParams = z.object({
   environment: z.string().optional(),
 });
diff --git a/apps/webapp/app/routes/_app.orgs.$organizationSlug.settings/route.tsx b/apps/webapp/app/routes/_app.orgs.$organizationSlug.settings/route.tsx
@@ -1,6 +1,6 @@
 import { conform, useForm } from "@conform-to/react";
 import { parse } from "@conform-to/zod";
-import { Form, useActionData, useNavigation } from "@remix-run/react";
+import { Form, MetaFunction, useActionData, useNavigation } from "@remix-run/react";
 import { ActionFunction, json } from "@remix-run/server-runtime";
 import { redirect } from "remix-typedjson";
 import { z } from "zod";
@@ -28,6 +28,14 @@ import { logger } from "~/services/logger.server";
 import { requireUserId } from "~/services/session.server";
 import { organizationPath, organizationSettingsPath, rootPath } from "~/utils/pathBuilder";
 
+export const meta: MetaFunction = () => {
+  return [
+    {
+      title: `Organization settings | Trigger.dev`,
+    },
+  ];
+};
+
 export function createSchema(
   constraints: {
     getSlugMatch?: (slug: string) => { isMatch: boolean; organizationSlug: string };
diff --git a/apps/webapp/app/routes/_app.orgs.$organizationSlug.team/route.tsx b/apps/webapp/app/routes/_app.orgs.$organizationSlug.team/route.tsx
@@ -1,7 +1,7 @@
 import { useForm } from "@conform-to/react";
 import { parse } from "@conform-to/zod";
 import { LockOpenIcon, UserPlusIcon } from "@heroicons/react/20/solid";
-import { Form, useActionData } from "@remix-run/react";
+import { Form, MetaFunction, useActionData } from "@remix-run/react";
 import { ActionFunction, LoaderFunctionArgs, json } from "@remix-run/server-runtime";
 import { useState } from "react";
 import { UseDataFunctionReturn, typedjson, useTypedLoaderData } from "remix-typedjson";
@@ -44,6 +44,14 @@ import {
   v3BillingPath,
 } from "~/utils/pathBuilder";
 
+export const meta: MetaFunction = () => {
+  return [
+    {
+      title: `Team | Trigger.dev`,
+    },
+  ];
+};
+
 const Params = z.object({
   organizationSlug: z.string(),
 });
diff --git a/apps/webapp/app/routes/_app.orgs.$organizationSlug.v3.billing/route.tsx b/apps/webapp/app/routes/_app.orgs.$organizationSlug.v3.billing/route.tsx
diff --git a/apps/webapp/app/routes/_app.orgs.$organizationSlug.v3.usage/route.tsx b/apps/webapp/app/routes/_app.orgs.$organizationSlug.v3.usage/route.tsx
diff --git a/apps/webapp/app/routes/account._index/route.tsx b/apps/webapp/app/routes/account._index/route.tsx
diff --git a/apps/webapp/app/routes/account.tokens/route.tsx b/apps/webapp/app/routes/account.tokens/route.tsx
