[docs] Add publish an update guide and other changes

docs/constants/navigation.js

@@ -306,9 +306,10 @@ const general = [
   makeSection('EAS Update', [
     makePage('eas-update/introduction.mdx'),
     makePage('eas-update/getting-started.mdx'),
-    makePage('eas-update/github-actions.mdx'),
+    makePage('eas-update/publish.mdx'),
     makePage('eas-update/eas-cli.mdx'),
     makePage('eas-update/develop-faster.mdx'),
+    makePage('eas-update/github-actions.mdx'),
     makePage('eas-update/faq.mdx'),
     makeGroup('Concepts', [
       makePage('eas-update/how-it-works.mdx'),

docs/pages/eas-update/develop-faster.mdx

@@ -1,20 +1,20 @@
 ---
-title: Develop with EAS Update
-sidebar_title: Develop faster
-description: Learn how to iterate faster with EAS Update.
+title: Updates distribution during development
+sidebar_title: Distribution during development
+description: Learn how to iterate faster with EAS Update during the development phase.
+hideTOC: true
 ---
 
-import ImageSpotlight from '~/components/plugins/ImageSpotlight';
-
 EAS Update helps us fix critical bugs in production. It can also help us iterate faster with our team during development.
 
 ## Distributing updates to others during development
 
 Whether a new feature is being developed, stabilized, QA'd, or critiqued, it's often useful to to allow others to preview what it looks and feels like before it is released to production.
 
-Traditionally previewing meant re-building the project and distributing it to a reviewer manually. Previewing features with EAS Update removes the need for re-building in most cases and can help us preview new features more quickly.
+Traditionally previewing meant re-building the project and distributing it to a reviewer manually. Previewing features with EAS Update removes the need for rebuilding in most cases and can help us preview new features quicker.
 
 A published update can be loaded in various environments:
+
 - A [development build](/eas-update/expo-dev-client/) with a matching runtime version, distributed through [internal distribution](/build/internal-distribution/) or as an emulator or simulator build.
 - A release build distributed via Google Play beta, TestFlight, or [internal distribution](/build/internal-distribution/) with a matching runtime version and channel pointing to a branch with the published update. With this strategy, often an EAS Update channel like "alpha" or "beta" will be used, and builds and updates will be created from development branches in source control.
 - Expo Go can also load published updates in cases where custom native code is not used.

docs/pages/eas-update/eas-cli.mdx

@@ -1,7 +1,7 @@
 ---
-title: Use EAS Update with EAS CLI
-sidebar_title: Use EAS CLI
-description: Learn how to use link a branch to a channel and publish updates with EAS CLI.
+title: Manage branches and channels with EAS CLI
+sidebar_title: Manage branches and channels
+description: Learn how to link a branch to a channel and publish updates with EAS CLI.
 ---
 
 import ImageSpotlight from '~/components/plugins/ImageSpotlight';
@@ -10,14 +10,14 @@ import { Terminal } from '~/ui/components/Snippet';
 EAS Update works by linking _branches_ to _channels_. Channels are specified at build time and exist inside a build's native code. Branches are an ordered list of updates, similar to a Git branch, which is an ordered list of commits. With EAS Update, we can link any channel to any branch, allowing us to make different updates available to different builds.
 
 <ImageSpotlight
-  alt={`Channel "production" linked to branch "version-1.0"`}
+  alt='Channel "production" linked to branch "version-1.0"'
   src="/static/images/eas-update/channel-branch-link.png"
 />
 
 The diagram above visualizes this link. Here, we have the builds with the "production" channel linked to the branch named "version-1.0". When we're ready, we can adjust the channel–branch pointer. Imagine we have more fixes tested and ready on a branch named "version-2.0". We could update this link to make the "version-2.0" branch available to all builds with the "production" channel.
 
 <ImageSpotlight
-  alt={`Channel "production" linked to branch "version-2.0"`}
+  alt='Channel "production" linked to branch "version-2.0"'
   src="/static/images/eas-update/channel-branch-link-2.png"
 />
 

docs/pages/eas-update/getting-started.mdx

@@ -1,12 +1,14 @@
 ---
 title: Get started
-description: Learn how to get started with EAS Update and use it in your project.
+description: Learn how to get started with the setup required to configure and use EAS Update in your project.
 ---
 
 import { Terminal } from '~/ui/components/Snippet';
 import { Step } from '~/ui/components/Step';
+import { BoxLink } from '~/ui/components/BoxLink';
+import { LayersTwo02Icon } from '@expo/styleguide-icons';
 
-Setting up EAS Update allows you to push critical bug fixes and improvements that your users need right away.
+Setting up EAS Update allows you to push critical bug fixes and improvements that your users need right away. This guide will walk you through the process of setting up EAS Update in your project.
 
 <Step label="1">
 ## Install the latest EAS CLI
@@ -22,7 +24,7 @@ You can also use the above command to check if a new version of EAS CLI is avail
 </Step>
 
 <Step label="2">
-## Log in to your Expo account
+## Login to your Expo account
 
 If you are already signed in to an Expo account using Expo CLI, you can skip the steps described in this section. If you are not, run the following command to log in:
 
@@ -104,25 +106,11 @@ Then, make any desired changes to your project's JavaScript, styling, or image a
 
 </Step>
 
-<Step label="7">
-## Publish an update
-
-To publish an update to the build, run the following command:
-
-<Terminal
-  cmd={[
-    '# eas update --branch [branch] --message [message]',
-    '',
-    '# Example',
-    '$ eas update --branch preview --message "Updating the app"',
-  ]}
-  cmdCopy={null}
-/>
-
-Once the update is built and uploaded to EAS and the command completes, force close and reopen your app up to two times to download and view the update. By default, `expo-updates` checks for updates every time the app is loaded. However, you can also implement a custom strategy with the [Updates API](/versions/latest/sdk/updates) and [app config](/versions/latest/config/app/#updates). If your app is not updating as expected, [validate your configuration](/eas-update/debug).
-
-</Step>
-
 ## Next step
 
-You can publish updates continuously with GitHub Actions. See [Using GitHub Actions with EAS Update](/eas-update/github-actions) for more information.
+<BoxLink
+  title="Publish an update"
+  description="Learn how to publish an update to a specific branch with EAS Update."
+  href="/eas-update/publish/"
+  Icon={LayersTwo02Icon}
+/>

docs/pages/eas-update/introduction.mdx

@@ -6,6 +6,7 @@ description: An introduction to EAS Update which is a hosted service for project
 ---
 
 import { BoxLink } from '~/ui/components/BoxLink';
+import { LayersTwo02Icon } from '@expo/styleguide-icons';
 
 **EAS Update** is a hosted service that serves updates for projects using the [`expo-updates`](/versions/latest/sdk/updates) library.
 
@@ -35,18 +36,28 @@ Apply updates through [`expo-updates` API](/versions/latest/sdk/updates) and [ap
 
 <BoxLink
   title="Get started with EAS Update"
-  description="Get started with EAS Update and use it in your project."
-  href="/eas-update/getting-started"
+  description="Learn how to get started with the setup required to configure and use EAS Update in your project."
+  href="/eas-update/getting-started/"
+  Icon={LayersTwo02Icon}
+/>
+
+<BoxLink
+  title="Publish an update"
+  description="Learn how to publish an update to a specific branch with EAS Update."
+  href="/eas-update/publish/"
+  Icon={LayersTwo02Icon}
 />
 
 <BoxLink
   title="Use GitHub Actions"
   description="Publish an update and preview with a QR code after a commit."
-  href="/eas-update/github-actions"
+  href="/eas-update/github-actions/"
+  Icon={LayersTwo02Icon}
 />
 
 <BoxLink
   title="Develop faster"
   description="View your teammate's changes with EAS Update."
-  href="/eas-update/develop-faster"
+  href="/eas-update/develop-faster/"
+  Icon={LayersTwo02Icon}
 />

docs/pages/eas-update/publish.mdx

@@ -0,0 +1,64 @@
+---
+title: How to publish an update
+sidebar_title: Publish an update
+description: Learn how to publish an update to a specific branch with EAS Update.
+---
+
+import { Terminal } from '~/ui/components/Snippet';
+import { BoxLink } from '~/ui/components/BoxLink';
+import { LayersTwo02Icon } from '@expo/styleguide-icons';
+
+Publishing an update allows fixing bugs and quickly updating non-native parts of a project instead of creating a new build. This guide explains the steps required to publish an update, how it works, and methods to test it.
+
+## Publish an update
+
+To publish an update with changes from your project, you can use the `eas update` command, and specify a name for the `branch` and a `message` to describe the update:
+
+<Terminal cmd={['$ eas update --branch [branch-name] --message "[message]"']} />
+
+### How does publishing an update work
+
+When you publish an update with the `eas update` command, it generates a new update bundle and uploads it to the EAS servers. The `branch` name is used to identify the update and is associated with the uploaded bundle. It is similar to how Git commit works, where every commit is associated with a Git branch.
+
+For example, you want to publish an update for the [`development` build profile](/build/eas-json/#build-profiles). You can use it as the branch name to associate the update with its build profile. When the app requests an update, it will download the update associated with the `development` branch.
+
+For this example, the command to publish an update with the `development` branch and a message is:
+
+<Terminal cmd={['$ eas update --branch development --message "Fixes typo"']} />
+
+The above command runs `npx expo export` behind the scenes to generate a **dist** directory and create a local update bundle. This update bundle is uploaded to EAS servers.
+
+<BoxLink
+  title="In-depth guide on how EAS Update works"
+  description="Dive deep and learn how EAS Update works."
+  href="/eas-update/how-it-works/"
+  Icon={LayersTwo02Icon}
+/>
+
+## Test a published update
+
+After the update is uploaded to EAS, you can use one of the following methods to test the update:
+
+- [Expo Orbit to install and launch the update](/review/with-orbit/)
+- Implement a custom strategy with [Updates API](/versions/latest/sdk/updates/) and [app config](/versions/latest/config/app/#updates) to load updates in the app programmatically
+- Manually test the update by force closing and reopening your build up to two times to download and view the update
+
+> Updates for non-development builds (preview or production) are automatically downloaded to the device when the app starts up and makes a request for any new updates.
+
+## Troubleshooting
+
+If your app is not updating as expected, see the following debugging guides for techniques to validate your configuration:
+
+<BoxLink
+  title="Debug EAS Update"
+  description="Learn how to troubleshoot and debug an EAS Update."
+  href="/eas-update/debug/"
+  Icon={LayersTwo02Icon}
+/>
+
+<BoxLink
+  title="Advanced EAS Update Debugging"
+  description="Learn advanced strategies to debug an EAS Update."
+  href="/eas-update/debug-advanced/"
+  Icon={LayersTwo02Icon}
+/>