Skip to content

Commit 38409a6

Browse files
clairep94clairep94
committed
views/index: update to named export and add types
1 parent 0663d24 commit 38409a6

File tree

2 files changed

+81
-26
lines changed

2 files changed

+81
-26
lines changed

‎server/routes/server.routes.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import { Router } from 'express';
2-
import sendHtml, { renderIndex, renderProjectIndex } from '../views/index';
2+
import { sendHtml, renderIndex, renderProjectIndex } from '../views/index';
33
import { userExists } from '../controllers/user.controller';
44
import {
55
projectExists,

‎server/views/index.ts‎

Lines changed: 80 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,9 @@
1+
import { Request, Response } from 'express';
12
import get404Sketch from './404Page';
23

34
export function renderIndex() {
4-
const assetsManifest = process.env.webpackAssets && JSON.parse(process.env.webpackAssets);
5+
const assetsManifest =
6+
process.env.webpackAssets && JSON.parse(process.env.webpackAssets);
57
return `
68
<!DOCTYPE html>
79
<html lang="en">
@@ -11,7 +13,11 @@ export function renderIndex() {
1113
<meta name="keywords" content="p5.js, p5.js web editor, web editor, processing, code editor" />
1214
<meta name="description" content="A web editor for p5.js, a JavaScript library with the goal of making coding accessible to artists, designers, educators, and beginners." />
1315
<title>p5.js Web Editor</title>
14-
${process.env.NODE_ENV === 'production' ? `<link rel='stylesheet' href='${assetsManifest['/app.css']}' />` : ''}
16+
${
17+
process.env.NODE_ENV === 'production'
18+
? `<link rel='stylesheet' href='${assetsManifest['/app.css']}' />`
19+
: ''
20+
}
1521
<link href='https://fonts.googleapis.com/css?family=Inconsolata:400,700' rel='stylesheet' type='text/css'>
1622
<link href='https://fonts.googleapis.com/css?family=Montserrat:400,700' rel='stylesheet' type='text/css'>
1723
<link rel='shortcut icon' href='/favicon.ico' type='image/x-icon' / >
@@ -25,31 +31,54 @@ export function renderIndex() {
2531
window.process.env.API_URL = '${process.env.API_URL}';
2632
window.process.env.NODE_ENV = '${process.env.NODE_ENV}';
2733
window.process.env.S3_BUCKET = '${process.env.S3_BUCKET}';
28-
window.process.env.S3_BUCKET_URL_BASE = ${process.env.S3_BUCKET_URL_BASE ? `'${process.env.S3_BUCKET_URL_BASE}'` : undefined};
34+
window.process.env.S3_BUCKET_URL_BASE = ${
35+
process.env.S3_BUCKET_URL_BASE
36+
? `'${process.env.S3_BUCKET_URL_BASE}'`
37+
: undefined
38+
};
2939
window.process.env.AWS_REGION = '${process.env.AWS_REGION}';
30-
window.process.env.FORCE_TO_HTTPS = ${process.env.FORCE_TO_HTTPS === 'false' ? false : undefined};
40+
window.process.env.FORCE_TO_HTTPS = ${
41+
process.env.FORCE_TO_HTTPS === 'false' ? false : undefined
42+
};
3143
window.process.env.CLIENT = true;
32-
window.process.env.LOGIN_ENABLED = ${process.env.LOGIN_ENABLED === 'false' ? false : true};
33-
window.process.env.EXAMPLES_ENABLED = ${process.env.EXAMPLES_ENABLED === 'false' ? false : true};
34-
window.process.env.UI_ACCESS_TOKEN_ENABLED = ${process.env.UI_ACCESS_TOKEN_ENABLED === 'false' ? false : true};
35-
window.process.env.UI_COLLECTIONS_ENABLED = ${process.env.UI_COLLECTIONS_ENABLED === 'false' ? false : true};
36-
window.process.env.UPLOAD_LIMIT = ${process.env.UPLOAD_LIMIT ? `${process.env.UPLOAD_LIMIT}` : undefined};
37-
window.process.env.TRANSLATIONS_ENABLED = ${process.env.TRANSLATIONS_ENABLED === 'true' ? true : false};
44+
window.process.env.LOGIN_ENABLED = ${
45+
process.env.LOGIN_ENABLED !== 'false'
46+
};
47+
window.process.env.EXAMPLES_ENABLED = ${
48+
process.env.EXAMPLES_ENABLED !== 'false'
49+
};
50+
window.process.env.UI_ACCESS_TOKEN_ENABLED = ${
51+
process.env.UI_ACCESS_TOKEN_ENABLED !== 'false'
52+
};
53+
window.process.env.UI_COLLECTIONS_ENABLED = ${
54+
process.env.UI_COLLECTIONS_ENABLED !== 'false'
55+
};
56+
window.process.env.UPLOAD_LIMIT = ${
57+
process.env.UPLOAD_LIMIT ? `${process.env.UPLOAD_LIMIT}` : undefined
58+
};
59+
window.process.env.TRANSLATIONS_ENABLED = ${
60+
process.env.TRANSLATIONS_ENABLED === 'true'
61+
};
3862
window.process.env.PREVIEW_URL = '${process.env.PREVIEW_URL}';
3963
window.process.env.GA_MEASUREMENT_ID='${process.env.GA_MEASUREMENT_ID}';
4064
</script>
4165
</head>
4266
<body>
4367
<div id="root" class="root-app">
4468
</div>
45-
<script src='${process.env.NODE_ENV === 'production' ? `${assetsManifest['/app.js']}` : '/app.js'}'></script>
69+
<script src='${
70+
process.env.NODE_ENV === 'production'
71+
? `${assetsManifest['/app.js']}`
72+
: '/app.js'
73+
}'></script>
4674
</body>
4775
</html>
4876
`;
4977
}
5078

51-
export function renderProjectIndex(username, projectName) {
52-
const assetsManifest = process.env.webpackAssets && JSON.parse(process.env.webpackAssets);
79+
export function renderProjectIndex(username: string, projectName: string) {
80+
const assetsManifest =
81+
process.env.webpackAssets && JSON.parse(process.env.webpackAssets);
5382
return `
5483
<!DOCTYPE html>
5584
<html lang="en">
@@ -59,7 +88,11 @@ export function renderProjectIndex(username, projectName) {
5988
<meta name="keywords" content="p5.js, p5.js web editor, web editor, processing, code editor" />
6089
<meta name="description" content="A web editor for p5.js, a JavaScript library with the goal of making coding accessible to artists, designers, educators, and beginners." />
6190
<title>${`${projectName} by ${username} -`}p5.js Web Editor</title>
62-
${process.env.NODE_ENV === 'production' ? `<link rel='stylesheet' href='${assetsManifest['/app.css']}' />` : ''}
91+
${
92+
process.env.NODE_ENV === 'production'
93+
? `<link rel='stylesheet' href='${assetsManifest['/app.css']}' />`
94+
: ''
95+
}
6396
<link href='https://fonts.googleapis.com/css?family=Inconsolata' rel='stylesheet' type='text/css'>
6497
<link href='https://fonts.googleapis.com/css?family=Montserrat:400,700' rel='stylesheet' type='text/css'>
6598
<link rel='shortcut icon' href='/favicon.ico' type='image/x-icon' / >
@@ -73,24 +106,46 @@ export function renderProjectIndex(username, projectName) {
73106
window.process.env.API_URL = '${process.env.API_URL}';
74107
window.process.env.NODE_ENV = '${process.env.NODE_ENV}';
75108
window.process.env.S3_BUCKET = '${process.env.S3_BUCKET}';
76-
window.process.env.S3_BUCKET_URL_BASE = ${process.env.S3_BUCKET_URL_BASE ? `'${process.env.S3_BUCKET_URL_BASE}'` : undefined};
109+
window.process.env.S3_BUCKET_URL_BASE = ${
110+
process.env.S3_BUCKET_URL_BASE
111+
? `'${process.env.S3_BUCKET_URL_BASE}'`
112+
: undefined
113+
};
77114
window.process.env.AWS_REGION = '${process.env.AWS_REGION}';
78-
window.process.env.FORCE_TO_HTTPS = ${process.env.FORCE_TO_HTTPS === 'false' ? false : undefined};
115+
window.process.env.FORCE_TO_HTTPS = ${
116+
process.env.FORCE_TO_HTTPS === 'false' ? false : undefined
117+
};
79118
window.process.env.CLIENT = true;
80-
window.process.env.LOGIN_ENABLED = ${process.env.LOGIN_ENABLED === 'false' ? false : true};
81-
window.process.env.EXAMPLES_ENABLED = ${process.env.EXAMPLES_ENABLED === 'false' ? false : true};
82-
window.process.env.UI_ACCESS_TOKEN_ENABLED = ${process.env.UI_ACCESS_TOKEN_ENABLED === 'false' ? false : true};
83-
window.process.env.UI_COLLECTIONS_ENABLED = ${process.env.UI_COLLECTIONS_ENABLED === 'false' ? false : true};
84-
window.process.env.UPLOAD_LIMIT = ${process.env.UPLOAD_LIMIT ? `${process.env.UPLOAD_LIMIT}` : undefined};
85-
window.process.env.TRANSLATIONS_ENABLED = ${process.env.TRANSLATIONS_ENABLED === 'true' ? true : false};
119+
window.process.env.LOGIN_ENABLED = ${
120+
process.env.LOGIN_ENABLED !== 'false'
121+
};
122+
window.process.env.EXAMPLES_ENABLED = ${
123+
process.env.EXAMPLES_ENABLED !== 'false'
124+
};
125+
window.process.env.UI_ACCESS_TOKEN_ENABLED = ${
126+
process.env.UI_ACCESS_TOKEN_ENABLED !== 'false'
127+
};
128+
window.process.env.UI_COLLECTIONS_ENABLED = ${
129+
process.env.UI_COLLECTIONS_ENABLED !== 'false'
130+
};
131+
window.process.env.UPLOAD_LIMIT = ${
132+
process.env.UPLOAD_LIMIT ? `${process.env.UPLOAD_LIMIT}` : undefined
133+
};
134+
window.process.env.TRANSLATIONS_ENABLED = ${
135+
process.env.TRANSLATIONS_ENABLED === 'true'
136+
};
86137
window.process.env.PREVIEW_URL = '${process.env.PREVIEW_URL}';
87138
window.process.env.GA_MEASUREMENT_ID='${process.env.GA_MEASUREMENT_ID}';
88139
</script>
89140
</head>
90141
<body>
91142
<div id="root" class="root-app">
92143
</div>
93-
<script src='${process.env.NODE_ENV === 'production' ? `${assetsManifest['/app.js']}` : '/app.js'}'></script>
144+
<script src='${
145+
process.env.NODE_ENV === 'production'
146+
? `${assetsManifest['/app.js']}`
147+
: '/app.js'
148+
}'></script>
94149
</body>
95150
</html>
96151
`;
@@ -102,12 +157,12 @@ export function renderProjectIndex(username, projectName) {
102157
* @param {import('express').e.Response} res
103158
* @param {boolean} [exists]
104159
*/
105-
export default async function sendHtml(req, res, exists = true) {
160+
export async function sendHtml(req: Request, res: Response, exists = true) {
106161
if (!exists) {
107162
res.status(404);
108163
const html = await get404Sketch();
109164
res.send(html);
110165
} else {
111166
res.send(renderIndex());
112167
}
113-
};
168+
}

0 commit comments

Comments
 (0)