Updating dash instructions for Pages docs

Author: Oxyjun

src/content/docs/pages/configuration/api.mdx

@@ -8,7 +8,7 @@ banner:
     id: pages-migrate-to-workers
 ---
 
-import { APIRequest } from "~/components";
+import { APIRequest, DashButton } from "~/components";
 
 The [Pages API](/api/resources/pages/subresources/projects/methods/list/) empowers you to build automations and integrate Pages with your development workflow. At a high level, the API endpoints let you manage deployments and builds and configure projects. Cloudflare supports [Deploy Hooks](/pages/configuration/deploy-hooks/) for headless CMS deployments. Refer to the [API documentation](https://api.cloudflare.com/) for a full breakdown of object types and endpoints.
 
@@ -18,10 +18,9 @@ The [Pages API](/api/resources/pages/subresources/projects/methods/list/) empowe
 
 To create an API token:
 
-1. Log in to the [Cloudflare dashboard](https://dash.cloudflare.com).
-2. Select the user icon on the top right of your dashboard > **My Profile**.
-3. Select [**API Tokens**](https://dash.cloudflare.com/profile/api-tokens) > **Create Token**.
-4. You can go to **Edit Cloudflare Workers** template > **Use template** or go to **Create Custom Token** > **Get started**. If you create a custom token, you will need to make sure to add the **Cloudflare Pages** permission with **Edit** access.
+1. <DashButton url="/?to=/:account/api-tokens" />
+2. Select **Create Token**.
+3. You can go to **Edit Cloudflare Workers** template > **Use template** or go to **Create Custom Token** > **Get started**. If you create a custom token, you will need to make sure to add the **Cloudflare Pages** permission with **Edit** access.
 
 ### Make requests
 

src/content/docs/pages/configuration/build-configuration.mdx

@@ -9,7 +9,7 @@ banner:
     id: pages-migrate-to-workers
 ---
 
-import { Details, PagesBuildPresetsTable } from "~/components";
+import { Details, PagesBuildPresetsTable, DashButton } from "~/components";
 
 You may tell Cloudflare Pages how your site needs to be built as well as where its output files will be located.
 
@@ -41,10 +41,9 @@ If you are not using a preset, use `exit 0` as your **Build command**.
 
 If your project makes use of environment variables to build your site, you can provide custom environment variables:
 
-1. Log in to the [Cloudflare dashboard](https://dash.cloudflare.com) and select your account.
-2. In **Account Home**, select **Workers & Pages**.
-3. In **Overview**, select your Pages project.
-4. Select **Settings** > **Environment variables**.
+1. <DashButton url="/?to=/:account/workers-and-pages" />
+2. Select your Pages project.
+3. Select **Settings** > **Environment variables**.
 
 The following system environment variables are injected by default (but can be overridden):
 

src/content/docs/pages/configuration/build-image.mdx

@@ -13,6 +13,7 @@ import {
 	PagesBuildEnvironment,
 	PagesBuildEnvironmentLanguages,
 	PagesBuildEnvironmentTools,
+	DashButton,
 } from "~/components";
 
 Cloudflare Pages' build environment has broad support for a variety of languages, such as Ruby, Node.js, Python, PHP, and Go.
@@ -86,9 +87,9 @@ The v3 build system updates the default tools, libraries and languages to their
 
 To migrate to this new version, configure your Pages project settings in the dashboard:
 
-1. Log in to the [Cloudflare dashboard](https://dash.cloudflare.com) and select your account.
-2. Select **Workers & Pages** > in **Overview**, select your Pages project.
-3. Go to **Settings** > **Build & deployments** > **Build system version** and select the latest version.
+1. <DashButton url="/?to=/:account/workers-and-pages" />
+2. Select your Pages project.
+3. Go to **Deployments** > **All deployments** > and select the latest version.
 
 If you were previously relying on the default versions of any languages or tools in the build system, your build may fail when migrating to v3. To fix this, you must specify the version you wish to use by [overriding](/pages/configuration/build-image/#overriding-default-versions) the default versions.
 

src/content/docs/pages/configuration/custom-domains.mdx

@@ -8,7 +8,7 @@ banner:
     id: pages-migrate-to-workers
 ---
 
-import { Render } from "~/components";
+import { Render, DashButton } from "~/components";
 
 When deploying your Pages project, you may wish to point custom domains (or subdomains) to your site.
 
@@ -62,9 +62,9 @@ Then, in **DNS** > **Records**:
 2. Select **Edit**.
 3. Select **Delete**.
 
-Next, in Account Home, go to **Workers & Pages**:
+Next, <DashButton url="/?to=/:account/workers-and-pages" />
 
-1. In **Overview**, select your Pages project.
+1. Select your Pages project.
 2. Go to **Custom domains**.
 3. Select the **three dot icon** next to your custom domain > **Remove domain**.
 

src/content/docs/pages/configuration/debugging-pages.mdx

@@ -8,15 +8,17 @@ banner:
     id: pages-migrate-to-workers
 ---
 
+import { DashButton } from "~/components";
+
 When setting up your Pages project, you may encounter various errors that prevent you from successfully deploying your site. This guide gives an overview of some common errors and solutions.
 
 ## Check your build log
 
 You can review build errors in your Pages build log. To access your build log:
 
-1. Log in to the [Cloudflare dashboard](https://dash.cloudflare.com).
-2. In **Account Home**, go to **Workers & Pages**.
-3. In **Overview**, select your Pages project > **View build**.
+1. <DashButton url="/?to=/:account/workers-and-pages" />
+2. Select your Pages project.
+3. Go to **Deployments** > **View details** > **Build log**.
 
 ![After logging in to the Cloudflare dashboard, access the build log by following the instructions above](~/assets/images/pages/platform/pages-build-log.png)
 

src/content/docs/pages/configuration/deploy-hooks.mdx

@@ -8,6 +8,8 @@ banner:
     id: pages-migrate-to-workers
 ---
 
+import { DashButton } from "~/components";
+
 With Deploy Hooks, you can trigger deployments using event sources beyond commits in your source repository. Each event source may obtain its own unique URL, which will receive HTTP POST requests in order to initiate new deployments. This feature allows you to integrate Pages with new or existing workflows. For example, you may:
 
 - Automatically deploy new builds whenever content in a Headless CMS changes
@@ -16,10 +18,9 @@ With Deploy Hooks, you can trigger deployments using event sources beyond commit
 
 To create a Deploy Hook:
 
-1. Log in to the [Cloudflare dashboard](https://dash.cloudflare.com) and select your account.
-2. In Account Home, select **Workers & Pages**.
-3. In **Overview**, select your Pages project.
-4. Go to **Settings** > **Builds & deployments** and select **Add deploy hook** to start configuration.
+1. <DashButton url="/?to=/:account/workers-and-pages" />
+2. Select your Pages project.
+3. Go to **Settings** > **Builds** and select **Add deploy hook** to start configuration.
 
 ![Add a deploy hook on the Cloudflare dashboard](~/assets/images/pages/platform/deploy-hooks-add.png)
 

src/content/docs/pages/configuration/preview-deployments.mdx

@@ -8,11 +8,12 @@ banner:
     id: pages-migrate-to-workers
 ---
 
+import { DashButton } from "~/components";
+
 Preview deployments allow you to preview new versions of your project without deploying it to production. To view preview deployments:
 
-1. Log in to the [Cloudflare dashboard](https://dash.cloudflare.com/login) and select your account.
-2. In **Account Home**, select **Workers & Pages**.
-3. Select your project and find the deployment you would like to view.
+1. <DashButton url="/?to=/:account/workers-and-pages" />
+2. Select your project and find the deployment you would like to view.
 
 Every time you open a new pull request on your GitHub repository, Cloudflare Pages will create a unique preview URL, which will stay updated as you continue to push new commits to the branch. This is only true when pull requests originate from the repository itself.
 
@@ -44,10 +45,9 @@ By default, preview deployments are enabled and available publicly. In your proj
 
 To protect your preview deployments behind Cloudflare Access:
 
-1. Log in to [Cloudflare dashboard](https://dash.cloudflare.com/login).
-2. In Account Home, select **Workers & Pages**.
-3. In **Overview**, select your Pages project.
-4. Go to **Settings** > **General** > and select **Enable access policy**.
+1. <DashButton url="/?to=/:account/workers-and-pages" />
+2. Select your Pages project.
+3. Go to **Settings** > **General** > and select **Enable access policy**.
 
 Note that this will only protect your preview deployments (for example, `373f31e2.user-example.pages.dev` and every other randomly generated preview link) and not your `*.pages.dev` domain or custom domain.
 

src/content/docs/pages/framework-guides/deploy-a-react-site.mdx

@@ -8,7 +8,7 @@ banner:
     id: pages-migrate-to-workers
 ---
 
-import { PagesBuildPreset, Render, PackageManagers } from "~/components";
+import { PagesBuildPreset, Render, PackageManagers, DashButton } from "~/components";
 
 [React](https://reactjs.org/) is a popular framework for building reactive and powerful front-end applications, built by the open-source team at Facebook.
 
@@ -53,8 +53,8 @@ npm run dev
 
 ### Deploy via the Cloudflare dashboard
 
-1. Log in to the [Cloudflare dashboard](https://dash.cloudflare.com/) and select your account.
-2. In Account Home, select **Workers & Pages** > **Create application** > **Pages** > **Connect to Git**.
+1. <DashButton url="/?to=/:account/workers-and-pages" />
+2. Select **Create application** > **Pages** > **Import an existing Git repository**.
 3. Select the new GitHub repository that you created and, in the **Set up builds and deployments** section, provide the following information:
 
 <div>

src/content/docs/pages/framework-guides/deploy-a-vite3-project.mdx

@@ -8,7 +8,7 @@ banner:
     id: pages-migrate-to-workers
 ---
 
-import { Render, PackageManagers } from "~/components";
+import { Render, PackageManagers, DashButton } from "~/components";
 
 [Vite](https://vitejs.dev) is a next-generation build tool for front-end developers. With [the release of Vite 3](https://vitejs.dev/blog/announcing-vite3.html), developers can make use of new command line (CLI) improvements, starter templates, and [more](https://github.com/vitejs/vite/blob/main/packages/vite/CHANGELOG.md#300-2022-07-13) to help build their front-end applications.
 
@@ -67,8 +67,8 @@ git push
 
 To deploy your site to Pages:
 
-1. Log in to the [Cloudflare dashboard](https://dash.cloudflare.com/) and select your account.
-2. In Account Home, select **Workers & Pages** > **Create application** > **Pages** > **Connect to Git**.
+1. <DashButton url="/?to=/:account/workers-and-pages" />
+2. Select **Create application** > **Pages** > **Import from an existing Git repository**.
 3. Select your new GitHub repository.
 4. In the **Set up builds and deployments**, set `npm run build` as the **Build command**, and `dist` as the **Build output directory**.