# Loading and unavailable states

## Loading and unavailable states

Loading content means the application is retrieving it. An unavailable authentication state
means the application cannot currently complete its authentication check and is retrying when a
stored token is available.

| If you need to… | Go to |
|---|---|
| Recognize the message beside article content or tags | [Understand the messages and fields](#understand-the-messages-and-fields) |
| Wait for content or reload while authentication retries | [Wait for content or reload](#wait-for-content-or-reload) |
| Distinguish an empty result from a temporary failure | [Handle the different states](#handle-the-different-states) |
| Recover after authentication does not load | [When authentication or content does not load](#when-authentication-or-content-does-not-load) |
| Sign in after authentication is cleared | [Sign in](doc:sign-in) |
| Read broader authentication guidance | [Authentication and loading messages](doc:authentication-and-loading-messages) |

On Home, the article area uses this pattern while the header communicates whether access is still
being checked, signed in, signed out, or temporarily unavailable.

## Before you start

Prerequisites

- Have access to the application and the Home or [Sign in](doc:sign-in) page.
- If authentication becomes unavailable, keep the stored token in place so automatic retry can
  continue.
- Allow the authentication request to return before deciding whether the state is temporary or
  requires signing in again.

Authentication becomes temporarily unavailable after a server error or network error. With a stored
token, retry waits for 2 seconds, then 4, then 8, and then 16 seconds; later retries remain at
16 seconds. A client error in the 4XX range clears authentication instead.

## Find the state on screen

Prerequisites

- Know whether you are checking article and tag content or authentication.

Steps

1. Select the matching navigation label:

   | If you need to check… | Select… |
   |---|---|
   | The header, article area, or Popular Tags area | **Home** |
   | The authentication form | **Sign in** |

**Result:** You are on the screen that can display the loading or unavailable message you need to
identify.

## Understand the messages and fields

Loading and authentication status appear in different areas. Use the message and its location to
identify what is happening.

| Area | What you can see | When it appears |
|---|---|---|
| Article area | `Loading articles...` | Article data is being requested |
| Tags area | `Loading tags...` | The tags request has not completed |
| Tags area | `No tags are here... yet.` | The tags request completes with no tags |
| Header | `Loading...` | Authentication is still loading |
| Header | `Connecting...` | Authentication is temporarily unavailable |
| Header tooltip | `Auth unavailable - retrying automatically` | Authentication is unavailable while retry is scheduled |

The authentication form uses **Email** and **Password**. On Register it also uses **Username**;
the username field does not appear on Login. The submit button uses the current page title,
which is **Sign in** on Login and **Sign up** on Register.

While the article area is retrieving content, article results, pagination, and the empty-article
message are not shown. When tags are empty, tag links are not shown. While the application is
checking access or reconnecting, signed-in navigation is not shown; the header instead uses the
message-specific navigation described above.

## Wait for content or reload

Use this procedure when Home is still retrieving article or tag content, or when the header says
`Connecting...`.

Prerequisites

- Be on Home.
- The page shows `Loading articles...`, `Loading tags...`, or `Connecting...`.

Steps

1. Keep the relevant page open and follow the matching action:

   | When you see… | Do this… |
   |---|---|
   | `Loading articles...` in the article area | Keep Home open until the article area changes |
   | `Loading tags...` in the tags area | Keep Home open until the tags area changes |
   | `Connecting...` in the header | Reload the page while automatic authentication retry continues |

**Result:** The page shows article results and pagination after a successful article request, or
it continues its authentication retry cycle after a temporary authentication failure.

## Handle the different states

Use the message and the content around it to choose the matching path.

Prerequisites

- Be on Home and see one of the messages or content conditions below.

Steps

1. Match what you see to the reader action in the table:

| What you see | What it means | What to do |
|---|---|---|
| `Loading...` in the header | Authentication is loading | Wait for the authentication check to finish |
| `Connecting...` in the header | Authentication is temporarily unavailable | Wait for automatic retry or reload the page |
| `Loading articles...` in the article area | The article request is in progress | Wait for the article request |
| `Loading tags...` in Popular Tags | The tags request is in progress | Wait for the tags request |
| `No tags are here... yet.` in Popular Tags | The tags request completed with no tags | Continue without selecting a tag |
| No articles are shown after the article request is loaded | The article list can show an empty-feed message | Read the empty-feed message in the article area |

**Result:** You have chosen the response that matches the message or content condition on screen.

Authentication responses take a different path: an invalid authentication response clears access,
while a server or network problem displays `Connecting...` and schedules retry. The article area
shows its loading message when a query starts and shows content when the query succeeds.

## When authentication or content does not load

Authentication failure handling determines whether the application clears the current
authentication or keeps it for retry. Dynamic API error entries are handled by the shared error
list on the pages that own those requests.

Prerequisites

- Know whether the header shows `Connecting...` or whether the page has returned to its signed-out
  view.

Steps

1. Follow the matching recovery action:

   | When you see… | Do this… |
   |---|---|
   | `Connecting...` in the header | Keep the current page open while automatic retry continues |
   | Access has been cleared after an invalid authentication response | Select [**Sign in**](doc:sign-in) |
   | A dynamic API error entry | Use [**General error messages**](doc:general-error-messages) |

**Result:** You either remain in the retrying authentication path or arrive at the sign-in task
after authentication is cleared.

## Know what happens next

A successful article request displays its results and calculates pagination. A successful
authentication retry restores signed-in navigation; an invalid authentication response clears
access and sends you to the sign-in task.

Prerequisites

- Have identified whether the page loaded content, is retrying authentication, or cleared
  authentication.

Steps

1. Follow the matching next action:

   | When… | Do this… |
   |---|---|
   | The article request finishes successfully | Continue reading the article results |
   | The header shows `Connecting...` | Keep the current page open while automatic retry uses 2, 4, 8, and 16-second intervals |
   | An invalid authentication response clears access | Select [**Sign in**](doc:sign-in) |
   | You need broader troubleshooting | Open [**Common issues and solutions**](doc:common-issues-and-solutions) |

**Result:** You continue with loaded content, remain in the automatic retry path, or reach the
next documented task for authentication recovery.
