Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix: live admin page authenticates with github #87

Open
wants to merge 13 commits into
base: main
Choose a base branch
from
9 changes: 7 additions & 2 deletions astro.config.mjs
Original file line number Diff line number Diff line change
Expand Up @@ -2,11 +2,16 @@ import { defineConfig } from "astro/config";
import mdx from "@astrojs/mdx";
import sitemap from "@astrojs/sitemap";
import tailwind from "@astrojs/tailwind";

import react from "@astrojs/react";

import node from "@astrojs/node";

// https://astro.build/config
export default defineConfig({
site: "https://example.com",
integrations: [mdx(), sitemap(), tailwind(), react()]
output: "hybrid",
integrations: [mdx(), sitemap(), tailwind(), react()],
adapter: node({
mode: "standalone"
})
Comment on lines +12 to +16
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This is probably why firebase is upset

});
8,001 changes: 1,349 additions & 6,652 deletions package-lock.json

Large diffs are not rendered by default.

5 changes: 3 additions & 2 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -14,6 +14,7 @@
"dependencies": {
"@astrojs/check": "^0.5.3",
"@astrojs/mdx": "^2.1.1",
"@astrojs/node": "^8.3.3",
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

What did you need node for?

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Astro requires an ssr adapter in order to enable server side rendering : https://docs.astro.build/en/guides/server-side-rendering

"@astrojs/react": "^3.1.0",
"@astrojs/rss": "^4.0.5",
"@astrojs/sitemap": "^3.0.5",
Expand All @@ -25,8 +26,6 @@
"@radix-ui/react-hover-card": "^1.0.7",
"@radix-ui/react-icons": "^1.3.0",
"@radix-ui/react-switch": "^1.1.0",
"@staticcms/core": "^4.1.2",
"@staticcms/proxy-server": "^4.0.4",
"@types/react": "^18.2.64",
"@types/react-dom": "^18.2.21",
"astro": "^4.3.6",
Expand All @@ -36,11 +35,13 @@
"react-dom": "^18.2.0",
"react-hook-form": "^7.51.3",
"react-select": "^5.8.0",
"simple-oauth2": "2.5.2",
"tailwindcss": "^3.4.1",
"typescript": "^5.3.3"
},
"devDependencies": {
"@brown-ccv/eslint-config": "^0.3.0",
"@types/simple-oauth2": "^2.5.2",
"eslint": "^8.56.0",
"eslint-plugin-astro": "^0.31.4",
"prettier": "^3.2.5",
Expand Down
8 changes: 0 additions & 8 deletions public/admin/config.js

This file was deleted.

10 changes: 5 additions & 5 deletions public/admin/config.yml
Original file line number Diff line number Diff line change
@@ -1,12 +1,12 @@
local_backend: true

backend:
name: github
repo: brown-ccv/mmp
base_url: /
site_domain: mmp.research.brown.edu
base_url: https://mmp.research.brown.edu/
auth_endpoint: oauth
media_folder: public/images
media_library:
max_file_size: 734003200
public_folder: public/images

i18n:
structure: multiple_folders
locales: [ en, es, pt ]
Expand Down
16 changes: 0 additions & 16 deletions public/admin/index.html

This file was deleted.

23 changes: 0 additions & 23 deletions public/admin/previews/NewsPreview.js

This file was deleted.

29 changes: 0 additions & 29 deletions public/admin/previews/PeoplePreview.js

This file was deleted.

20 changes: 20 additions & 0 deletions src/pages/admin.astro
Original file line number Diff line number Diff line change
@@ -0,0 +1,20 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta name="robots" content="noindex" />
<link href="/admin/config.yml" type="text/yaml" rel="cms-config-url" />
<title>Content Manager</title>
</head>
<body>
<!-- Dashboard script-->
<script src="https://unpkg.com/decap-cms@^3.1.0-beta.2/dist/decap-cms.js"></script>
<!-- CSS in preview panel -->
<script>
// @ts-expect-error CMS is defined globally
// eslint-disable-next-line
CMS.registerPreviewStyle("/global.css")
</script>
</body>
</html>
6 changes: 6 additions & 0 deletions src/pages/oauth/_config.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,6 @@
export const clientId = process.env.OAUTH_GITHUB_CLIENT_ID || import.meta.env.OAUTH_GITHUB_CLIENT_ID
export const clientSecret =
process.env.OAUTH_GITHUB_CLIENT_SECRET || import.meta.env.OAUTH_GITHUB_CLIENT_SECRET

export const authUrl = `https://github.com/login/oauth/authorize?client_id=${clientId}&scope=repo,user`
export const tokenUrl = "https://github.com/login/oauth/access_token"
61 changes: 61 additions & 0 deletions src/pages/oauth/callback.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,61 @@
export const prerender = "false"
import type { APIRoute } from "astro"
import { clientId, clientSecret, tokenUrl } from "./_config"

export const GET: APIRoute = async ({ url, redirect }) => {
const data = {
code: url.searchParams.get("code"),
client_id: clientId,
client_secret: clientSecret,
}

let script

try {
const response = await fetch(tokenUrl, {
method: "POST",
headers: {
Accept: "application/json",
"Content-Type": "application/json",
},
body: JSON.stringify(data),
})

if (!response.ok) {
throw new Error(`HTTP error! status: ${response.status}`)
}

const body = await response.json()

const content = {
token: body.access_token,
provider: "github",
}

// This is what talks to the DecapCMS page.
// Using window.postMessage we give it the token details in a format it's expecting
script = `
<script>
const receiveMessage = (message) => {
window.opener.postMessage(
'authorization:${content.provider}:success:${JSON.stringify(content)}',
message.origin
);

window.removeEventListener("message", receiveMessage, false);
}
window.addEventListener("message", receiveMessage, false);

window.opener.postMessage("authorizing:${content.provider}", "*");
</script>
`

return new Response(script, {
headers: { "Content-Type": "text/html" },
})
} catch (err) {
// If we hit an error we'll handle that here
console.log(err)
return redirect("/?error=😡")
}
}
7 changes: 7 additions & 0 deletions src/pages/oauth/index.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,7 @@
export const prerender = "false"
import type { APIRoute } from "astro"
import { authUrl } from "./_config"

export const GET: APIRoute = ({ redirect }) => {
return redirect(authUrl)
}
Loading