Skip to content

Commit

Permalink
EDIT_ORIGIN
Browse files Browse the repository at this point in the history
  • Loading branch information
@abernier
abernier committed Aug 12, 2024
1 parent ed6b3fe commit 7699441
Show file tree
Hide file tree
Showing 5 changed files with 48 additions and 24 deletions.
2 changes: 2 additions & 0 deletions .github/workflows/build.yml
View file
Original file line number Diff line number Diff line change
Expand Up @@ -38,13 +38,15 @@ jobs:
-e OUTPUT=export \
-e HOME_REDIRECT \
-e INLINE_IMAGES_ORIGIN \
-e EDIT_ORIGIN \
ghcr.io/pmndrs/docs:app-router npm run build
env:
BASE_PATH: ${{ steps.configurepages.outputs.base_path }}
MDX: ${{ inputs.mdx }}
NEXT_PUBLIC_LIBNAME: ${{ inputs.libname }}
HOME_REDIRECT: ${{ inputs.home_redirect }}
INLINE_IMAGES_ORIGIN: ${{ inputs.inline_images_origin }}/${{ inputs.mdx }}
EDIT_ORIGIN: 'https://github.com/${{ github.repository }}/edit/${{ github.ref_name }}/${{ inputs.mdx }}'
- uses: actions/upload-pages-artifact@v3
with:
Expand Down
54 changes: 37 additions & 17 deletions README.md
View file
Original file line number Diff line number Diff line change
@@ -1,12 +1,15 @@
| var | description | example | default |
| ----------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | -------------------------------------------------------------------------------------- | ------- |
| `MDX`\* | Path to `*.mdx` folder<br>NB: can be relative or absolute | `docs` or `~/code/myproject/documentation` | none |
| `NEXT_PUBLIC_LIBNAME`\* | Library name | `React Three Fiber` | none |
| `BASE_PATH` | Base path for the final URL | `/react-three-fiber` | none |
| `DIST_DIR` | Path to the output folder ([within project](https://nextjs.org/docs/app/api-reference/next-config-js/distDir#:~:text=should%20not%20leave%20your%20project%20directory)) | `out` or `docs/out/react-three-fiber` | none |
| `OUTPUT` | Set to `export` for static output | `export` | none |
| `HOME_REDIRECT` | Where the home should redirect | `/getting-started/introduction` | none |
| `INLINE_IMAGES_ORIGIN` | [Origin](https://developer.mozilla.org/en-US/docs/Web/API/URL/origin) for inlining relative images | `http://localhost:60141`or `https://github.com/pmndrs/react-three-fiber/raw/main/docs` | none |
# Configuration

| var | description | example | default |
| ----------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | ---------------------------------------------------------------------------------------- | ------- |
| `MDX`\* | Path to `*.mdx` folder<br>NB: can be relative or absolute | `docs` or `~/code/myproject/documentation` | none |
| `NEXT_PUBLIC_LIBNAME`\* | Library name | `React Three Fiber` | none |
| `BASE_PATH` | Base path for the final URL | `/react-three-fiber` | none |
| `DIST_DIR` | Path to the output folder ([within project](https://nextjs.org/docs/app/api-reference/next-config-js/distDir#:~:text=should%20not%20leave%20your%20project%20directory)) | `out` or `docs/out/react-three-fiber` | none |
| `OUTPUT` | Set to `export` for static output | `export` | none |
| `HOME_REDIRECT` | Where the home should redirect | `/getting-started/introduction` | none |
| `INLINE_IMAGES_ORIGIN` | [Origin](https://developer.mozilla.org/en-US/docs/Web/API/URL/origin) for inlining relative images | `http://localhost:60141`or `https://github.com/pmndrs/react-three-fiber/raw/master/docs` | none |
| `EDIT_ORIGIN` | [Origin](https://developer.mozilla.org/en-US/docs/Web/API/URL/origin) for displaying "Edit this page" URLs | `https://github.com/pmndrs/react-three-fiber/edit/master/docs` | none |

\* Required

Expand Down Expand Up @@ -37,15 +40,20 @@ Details:
$ (
trap 'kill -9 0' SIGINT

export _PORT=60141

# [Config](https://github.com/pmndrs/docs#configuration)
export MDX=~/code/pmndrs/react-three-fiber/docs
export NEXT_PUBLIC_LIBNAME="React Three Fiber"
export BASE_PATH=
export DIST_DIR=
export OUTPUT=export
export HOME_REDIRECT=/getting-started/introduction
export INLINE_IMAGES_ORIGIN=http://localhost:60141
export INLINE_IMAGES_ORIGIN=http://localhost:$_PORT
export EDIT_ORIGIN="vscode://file/$MDX"

npx serve $MDX -p $(echo $INLINE_IMAGES_ORIGIN | grep -oE '[0-9]+' | tail -1) --no-port-switching --no-clipboard &
kill $(lsof -ti:"$_PORT")
npx serve $MDX -p $_PORT --no-port-switching --no-clipboard &
npm run dev &

wait
Expand All @@ -65,17 +73,22 @@ $ (

rm -rf out

export _PORT=60141

# [Config](https://github.com/pmndrs/docs#configuration)
export MDX=~/code/pmndrs/react-three-fiber/docs
export NEXT_PUBLIC_LIBNAME="React Three Fiber"
export BASE_PATH=
export DIST_DIR=
export OUTPUT=export
export HOME_REDIRECT=/getting-started/introduction
export INLINE_IMAGES_ORIGIN=http://localhost:60141
export INLINE_IMAGES_ORIGIN=http://localhost:$_PORT
export EDIT_ORIGIN=

npm run build

npx serve $MDX -p $(echo $INLINE_IMAGES_ORIGIN | grep -oE '[0-9]+' | tail -1) --no-port-switching --no-clipboard &
kill $(lsof -ti:"$_PORT")
npx serve $MDX -p $_PORT --no-port-switching --no-clipboard &
npx serve out &

wait
Expand All @@ -95,26 +108,33 @@ $ cd ~/code/pmndrs/react-three-fiber
$ (
trap 'kill -9 0' SIGINT

export _PORT=60141

# [Config](https://github.com/pmndrs/docs#configuration)
export MDX=./docs
export NEXT_PUBLIC_LIBNAME="React Three Fiber"
export BASE_PATH=
export OUTPUT=export
export HOME_REDIRECT=/getting-started/introduction
export INLINE_IMAGES_ORIGIN=http://localhost:60141
export INLINE_IMAGES_ORIGIN=http://localhost:$_PORT
export EDIT_ORIGIN=

rm -rf "$MDX/out"

docker run --rm --init -it \
-v "$MDX":/app/docs \
-e BASE_PATH \
-e DIST_DIR="$MDX/out$BASE_PATH" \
-e MDX \
-e NEXT_PUBLIC_LIBNAME \
-e BASE_PATH \
-e DIST_DIR="$MDX/out$BASE_PATH" \
-e OUTPUT \
-e HOME_REDIRECT \
-e INLINE_IMAGES_ORIGIN \
-e EDIT_ORIGIN \
pmndrs-docs npm run build

npx serve $MDX -p $(echo $INLINE_IMAGES_ORIGIN | grep -oE '[0-9]+' | tail -1) --no-port-switching --no-clipboard &
kill $(lsof -ti:"$_PORT")
npx serve $MDX -p $_PORT --no-port-switching --no-clipboard &
npx -y serve "$MDX/out" &

wait
Expand Down
2 changes: 1 addition & 1 deletion src/app/[...slug]/DocsContext.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,7 @@ export type DocToC = {
export type Doc = {
slug: string[]
url: string
// editURL: string
editURL?: string
nav: number
title: string
description: string
Expand Down
5 changes: 2 additions & 3 deletions src/app/[...slug]/layout.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -66,10 +66,9 @@ export default async function Layout({ params, children }: Props) {
target="_blank"
rel="noopener noreferrer"
className="mb-2 text-base text-gray-500 hover:underline"
// href={currentPage.editURL}
href="#TODO"
href={currentPage.editURL || '#no-edit-url'}
>
Edit this page on GitHub
Edit this page
</a>
</div>
)}
Expand Down
9 changes: 6 additions & 3 deletions src/utils/docs.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -84,7 +84,10 @@ async function _getDocs(
//

const url = `/${slug.join('/')}`
// const editURL = file.replace(root, `https://github.com/pmndrs/${lib}`)

// editURL
const EDIT_ORIGIN = process.env.EDIT_ORIGIN
const editURL = EDIT_ORIGIN?.length ? file.replace(root, EDIT_ORIGIN) : undefined

// Read & parse doc
const compiled = matter(await fs.promises.readFile(file))
Expand All @@ -104,7 +107,7 @@ async function _getDocs(
// return {
// slug,
// url,
// // editURL,
// editURL,
// title,
// description,
// nav,
Expand Down Expand Up @@ -192,7 +195,7 @@ async function _getDocs(
return {
slug,
url,
// editURL,
editURL,
title,
description,
nav,
Expand Down

0 comments on commit 7699441

Please sign in to comment.