[docs] Consolidate build/submit eas.json reference into one page (#24491)

Co-authored-by: Brent Vatne <[email protected]>

[RFC] API Routes in Expo Router (#24429)

# Why

Servers are an important part of developing many different types of
apps, but they're much harder to configure than they need to be.

API Routes

[RFC] API Routes in Expo Router (#24429)

# Why

Servers are an important part of developing many different types of
apps, but they're much harder to configure than they need to be.

API Routes will enable users to express some abstract JavaScript code
that runs in a server by simply creating a file in the app directory,
and adding the `+api.js` suffix. For example, to securely interact with
OpenAI, simply:

```ts
// app/generate+api.ts
import { ExpoRequest, ExpoResponse } from 'expo-router/server';

export async function POST(req: ExpoRequest): Promise<ExpoResponse> {
const { prompt } = await req.json();

const json = await fetch('https://api.openai.com/v1/engines/text-davinci-003/completions', {
headers: {
'Content-Type': 'application/json',
// `OPENAI_API_KEY` is pulled from the .env file when running in Expo CLI.
Authorization: `Bearer ${process.env.OPENAI_API_KEY ?? ''}`,
},
method: 'POST',
body: JSON.stringify({
prompt,
max_tokens: 100,
}),
}).then(res => res.json());

// Return as JSON
return ExpoResponse.json(json);
}
```

This will be served at `http://localhost:8081/generate` with `npx expo`
and can be used by making a request:

```sh
$ curl -X POST -H "Content-Type: application/json" -d \'{"prompt":"Hello, my name is"}\' http://localhost:8081/generate
```

Expo Router polyfills the URL and `window.location` object on native to
allow for universally requesting with a relative URL:

```js
// Expo prepends the host and port to the URL automatically in development.
const json = await fetch('/generate').then(res => res.json());
```

# How

- API Routes are bundled with Metro, leveraging all the same
functionality as the rest of the app and website.
- The project babel config is used to transpile the API routes.
Indication is passed to the Babel caller via the `isServer` boolean.
This can be used to change the preset based on the environment.
- Each API route is bundled into a standalone file in the `dist/_expo`
directory. This is akin to ncc, the tool we use to make Create Expo App
download in ~1 second.
- Create a new package `@expo/server` which includes the requisite
middleware and runtime polyfills for the Expo server environment.
- Add a new routes manifest which will be used by `@expo/server` to
serve up the three types of routes: HTML routes, API routes, and not
found routes (404s).
- Add a new export `expo-router/server` (potentially will be moved to
`expo/server`) which contains the `ExpoRequest` and `ExpoResponse`
objects. These are all based on the WinterCG specification, and include
some additional properties for interop with the Expo Router filesystem
convention. These are inspired by Remix, SvelteKit, and Next.js for
simplicity.
- Add a new export mode `web.output: "server"` which can be used to
export a dynamic server. Note: I may drop this for now and make server
the default since there's no expo-specific hosting code that must be
exported.
- This PR adds the ability to host the app with an express server,
different production adapters to follow.

# Test Plan

In addition to all the E2E Metro tests, I've added a new E2E runner
which starts a server and pings different requests to ensure expected
behavior. These run in the CLI as opposed to the `@expo/server` package.

- resolve ENG-10057 ENG-8243 ENG-8082 ENG-8079 ENG-8242 ENG-8081
ENG-8080 ENG-9625

---------

Co-authored-by: Expo Bot <[email protected]>
Co-authored-by: Cedric van Putten <[email protected]>

show more ...

[docs] separate copy and link icons on headers/ collapsibles (#24448)

# Why
A follow-up to https://github.com/expo/expo/pull/24293 based on feedback
from @brentvatne . The goal is to create more c

[docs] separate copy and link icons on headers/ collapsibles (#24448)

# Why
A follow-up to https://github.com/expo/expo/pull/24293 based on feedback
from @brentvatne . The goal is to create more consistency and clarity
between the anchor link and copy anchor link functionality on both
headers and collapsibles.

**UPDATE**: After talking with Brent, I removed the copy functionality,
the idea being that, now that clicking the link icon everywhere gets you
an updated URL, it's easy enough to copy. So, this really just updates
collapsibles and removes copy functionality from the headings. I left
the icon switch in there in case there was some appeal to that, since
the link icon seemed to be a one-off.

# How (old)
There's a few ways to slice this, but this approach is to try separating
the functionality into two icons. I've definitely seen this elsewhere,
can't remember where tho.
<img width="419" alt="image"
src="https://github.com/expo/expo/assets/8053974/19917dd5-eeae-4bcd-9152-242608fbf39c">
<img width="554" alt="image"
src="https://github.com/expo/expo/assets/8053974/12164972-6728-4e08-b993-2d3c38026ba4">

Now we have consistent rules for both headers and collapsibles:
- the link icon always navigates to the anchor tag on click
- the copy icon always copies the anchor tag on click (and __only__
copies, no updating of the URL here!)

Additionally, we now have better copy feedback:
<img width="301" alt="image"
src="https://github.com/expo/expo/assets/8053974/2587ad54-bd3f-4977-9361-97092ef8f3c6">
<img width="301" alt="image"
src="https://github.com/expo/expo/assets/8053974/946fae82-c6bf-4225-a097-3836e95b028d">

Design notes:
- I removed the arrow from the tooltip since, if the heading is at the
top of the page, the tooltip moves below the icon, but the arrow still
points down ��
- I didn't see a copy icon in the docs, noticed it seemed like a lot of
other icons were going in the styleguide direction, so I switched both
icons to styleguide. I have no idea how to see all the icons, so I'm not
sure if this is the best of the like 20 different link icons.

## Special collapsible stuff
- Unlike a heading, where you can click anywhere and navigate to the
anchor tag, you have to click the link icon in order to navigate anchor
tag here. This is so you can expand the collapsible without also
scrolling the page.
- If you click the link icon and the collapsible is closed, it will
expand the collapsible as well as updating the URL. However, if the
collapsible is already open, clicking the link icon will not close it.
Thus, clicking the link icon will always leave you in the same state as
if you copied the URL with anchor tag and opened it in another tab.
- The copy icon also expands the collapsible but will not close it.

# Test Plan
- [x] clicking on header text updates URL with anchor tag
- [x] Headers: clicking on link icon updates URL with anchor tag
~~- [x] Headers: clicking on copy icon copies URL (doesn't navigate)~~
- [x] Collapsibles: clicking on header expands/ collapses section ONLY
- [x] Collapsibles: clicking on link expands and navigates
~~- [x] Collapsibles: clicking on copy expands and copies (doesn't
navigate)~~
~~- [x] Collapsibles: clicking on link or copy when already opened
doesn't close~~
~~- [x] Copy tooltip: updates to "Copied!" on click~~

# Checklist

<!--
Please check the appropriate items below if they apply to your diff.
This is required for changes to Expo modules.
-->

- [ ] Documentation is up to date to reflect these changes (eg:
https://docs.expo.dev and README.md).
- [ ] Conforms with the [Documentation Writing Style
Guide](https://github.com/expo/expo/blob/main/guides/Expo%20Documentation%20Writing%20Style%20Guide.md)
- [ ] This diff will work correctly for `npx expo prebuild` & EAS Build
(eg: updated a module plugin).

show more ...

Revert "separate copy/ link icons on headers and collapsibles"

This reverts commit 857493dcbcd6761210ef538660efdca44afe2a00.

Revert "remove round arrow from tippy to prevent opposite facing arrow when scrolled to page top"

This reverts commit 623daeb3e279007b48e035f807c654e2e550b198.

remove round arrow from tippy to prevent opposite facing arrow when scrolled to page top

separate copy/ link icons on headers and collapsibles

[docs] Make Copiable header links / Anchor tags for collapsible headers (#24293)

# Why

https://linear.app/expo/issue/ENG-9863/make-collapsible-headers-as-anchor-links

Fun story:
1. I origina

[docs] Make Copiable header links / Anchor tags for collapsible headers (#24293)

# Why

https://linear.app/expo/issue/ENG-9863/make-collapsible-headers-as-anchor-links

Fun story:
1. I originally though @brentvatne was asking for a quick copy button
for the anchor links for headers
2. So I did that, and __then__ I read @amandeepmittal's Linear issue.
3. So then I made anchor tags for collapsible headers
4. ...which required the quick copy button to be useful.

# How
## Copiable header links
I took inspiration from the [React Native Upgrade
Advisor](https://react-native-community.github.io/upgrade-helper/?from=0.71.11&to=0.72.1):
<img width="428" alt="image"
src="https://github.com/expo/expo/assets/8053974/d6bf26e5-2ade-481a-ad01-16a264b3e480">
Right now, it only shows the first tooltip. I would like it have it
change on copy like the upgrade advisor, but the tooltip disappears on
copy, and then when you hover over it again, it shows both tooltips, so
there's some figuring out about how tippy.js works to do to make this
work:
<img width="221" alt="image"
src="https://github.com/expo/expo/assets/8053974/304639f9-e146-4a6e-87b8-249a0cbec029">

Like the Upgrade Advisor links, I made the anchor button itself not move
the page/ set the URL, since it seemed kind of nice to be able to do
just do the copy. I could see going the other way, though

## Anchors for collapsible links
Some of this code is copied from `Permalink` in order to make the
`details` component be aware of the anchor tag, opening the details when
navigating to the anchor.

These headers/ anchor links definitely do not set the URL, so the page
doesn't jump while it's also expanding an element. Thus, the only way to
get the anchor is by pressing the copy icon. But pasting in the URL will
take you to the collapsible section and expand it, while still allowing
you to collapse it again.

# Test Plan
- [x] didn't break existing headers/ permalink functionality
- [x] copy works
- [x] didn't break existing collapsible functionality
- [x] can copy a collapsible link
- [x] can navigate directly to a collapsible and it expands
- [x] can still collapse a collapsible after navigating

# Checklist

<!--
Please check the appropriate items below if they apply to your diff.
This is required for changes to Expo modules.
-->

- [ ] Documentation is up to date to reflect these changes (eg:
https://docs.expo.dev and README.md).
- [ ] Conforms with the [Documentation Writing Style
Guide](https://github.com/expo/expo/blob/main/guides/Expo%20Documentation%20Writing%20Style%20Guide.md)
- [ ] This diff will work correctly for `npx expo prebuild` & EAS Build
(eg: updated a module plugin).

---------

Co-authored-by: Bartosz Kaszubowski <[email protected]>

show more ...

[docs] Add HTML tag for Google site verification (#24342)