From 993dd1e7f49ca9f0160208f6b23c2cde24ef8553 Mon Sep 17 00:00:00 2001 From: httpjamesm Date: Mon, 13 Nov 2023 20:00:54 -0500 Subject: [PATCH] fix: config utils --- apps/cast/configUtil.js | 52 +++++++++++++++++++++ apps/cast/next.config.js | 88 +++++++++++++++++++++++++++++++++-- apps/cast/package.json | 8 ++-- apps/cast/src/pages/index.tsx | 28 +++++++++-- 4 files changed, 164 insertions(+), 12 deletions(-) create mode 100644 apps/cast/configUtil.js diff --git a/apps/cast/configUtil.js b/apps/cast/configUtil.js new file mode 100644 index 000000000..679a92f30 --- /dev/null +++ b/apps/cast/configUtil.js @@ -0,0 +1,52 @@ +const cp = require('child_process'); +const { getIsSentryEnabled } = require('./sentryConfigUtil'); + +module.exports = { + WEB_SECURITY_HEADERS: { + 'Strict-Transport-Security': ' max-age=63072000', + 'X-Content-Type-Options': 'nosniff', + 'X-Download-Options': 'noopen', + 'X-Frame-Options': 'deny', + 'X-XSS-Protection': '1; mode=block', + 'Referrer-Policy': 'same-origin', + }, + + CSP_DIRECTIVES: { + // self is safe enough + 'default-src': "'self'", + // data to allow two factor qr code + 'img-src': "'self' blob: data: https://*.openstreetmap.org", + 'media-src': "'self' blob:", + 'manifest-src': "'self'", + 'style-src': "'self' 'unsafe-inline'", + 'font-src ': "'self'; script-src 'self' 'unsafe-eval' blob:", + 'connect-src': + "'self' https://*.ente.io http://localhost:8080 data: blob: https://ente-prod-eu.s3.eu-central-003.backblazeb2.com https://ente-prod-v3.s3.eu-central-2.wasabisys.com/ https://ente-staging-eu.s3.eu-central-003.backblazeb2.com/ ws://localhost:3000/", + 'base-uri ': "'self'", + // to allow worker + 'child-src': "'self' blob:", + 'object-src': "'none'", + 'frame-ancestors': " 'none'", + 'form-action': "'none'", + 'report-uri': ' https://csp-reporter.ente.io/local', + 'report-to': ' https://csp-reporter.ente.io/local', + }, + + ALL_ROUTES: '/(.*)', + + buildCSPHeader: (directives) => ({ + 'Content-Security-Policy-Report-Only': Object.entries( + directives + ).reduce((acc, [key, value]) => acc + `${key} ${value};`, ''), + }), + + convertToNextHeaderFormat: (headers) => + Object.entries(headers).map(([key, value]) => ({ key, value })), + + getGitSha: () => + cp.execSync('git rev-parse --short HEAD', { + cwd: __dirname, + encoding: 'utf8', + }), + getIsSentryEnabled: getIsSentryEnabled, +}; diff --git a/apps/cast/next.config.js b/apps/cast/next.config.js index b13dbe4e0..3d4340556 100644 --- a/apps/cast/next.config.js +++ b/apps/cast/next.config.js @@ -1,6 +1,84 @@ -/** @type {import('next').NextConfig} */ -const nextConfig = { - reactStrictMode: true, -}; +const withBundleAnalyzer = require('@next/bundle-analyzer')({ + enabled: process.env.ANALYZE === 'true', +}); -module.exports = nextConfig; +const { withSentryConfig } = require('@sentry/nextjs'); +const { PHASE_DEVELOPMENT_SERVER } = require('next/constants'); + +const { + getGitSha, + convertToNextHeaderFormat, + buildCSPHeader, + WEB_SECURITY_HEADERS, + CSP_DIRECTIVES, + ALL_ROUTES, + getIsSentryEnabled, +} = require('./configUtil'); + +const GIT_SHA = getGitSha(); + +const IS_SENTRY_ENABLED = getIsSentryEnabled(); + +module.exports = (phase) => + withSentryConfig( + withBundleAnalyzer({ + sentry: { + hideSourceMaps: false, + widenClientFileUpload: true, + }, + compiler: { + emotion: { + importMap: { + '@mui/material': { + styled: { + canonicalImport: ['@emotion/styled', 'default'], + styledBaseImport: ['@mui/material', 'styled'], + }, + }, + '@mui/material/styles': { + styled: { + canonicalImport: ['@emotion/styled', 'default'], + styledBaseImport: [ + '@mui/material/styles', + 'styled', + ], + }, + }, + }, + }, + }, + transpilePackages: [ + '@mui/material', + '@mui/system', + '@mui/icons-material', + ], + env: { + SENTRY_RELEASE: GIT_SHA, + NEXT_PUBLIC_IS_TEST_APP: process.env.IS_TEST_RELEASE, + }, + + headers() { + return [ + { + // Apply these headers to all routes in your application.... + source: ALL_ROUTES, + headers: convertToNextHeaderFormat({ + ...WEB_SECURITY_HEADERS, + ...buildCSPHeader(CSP_DIRECTIVES), + }), + }, + ]; + }, + // https://dev.to/marcinwosinek/how-to-add-resolve-fallback-to-webpack-5-in-nextjs-10-i6j + webpack: (config, { isServer }) => { + if (!isServer) { + config.resolve.fallback.fs = false; + } + return config; + }, + }), + { + release: GIT_SHA, + dryRun: phase === PHASE_DEVELOPMENT_SERVER || !IS_SENTRY_ENABLED, + } + ); diff --git a/apps/cast/package.json b/apps/cast/package.json index cc06f8902..f97eddcb5 100644 --- a/apps/cast/package.json +++ b/apps/cast/package.json @@ -9,16 +9,16 @@ "lint": "next lint" }, "dependencies": { + "next": "14.0.2", "react": "^18", - "react-dom": "^18", - "next": "14.0.2" + "react-dom": "^18" }, "devDependencies": { - "typescript": "^5", "@types/node": "^20", "@types/react": "^18", "@types/react-dom": "^18", "eslint": "^8", - "eslint-config-next": "14.0.2" + "eslint-config-next": "14.0.2", + "typescript": "^5" } } diff --git a/apps/cast/src/pages/index.tsx b/apps/cast/src/pages/index.tsx index a5fd1705d..2168691ab 100644 --- a/apps/cast/src/pages/index.tsx +++ b/apps/cast/src/pages/index.tsx @@ -1,10 +1,32 @@ // import { Inter } from 'next/font/google'; -// import { useEffect } from 'react'; -// import { syncCollections } from 'services/collectionService'; -// import { syncFiles } from 'services/fileService'; +import { useEffect } from 'react'; +import { syncCollections } from 'services/collectionService'; +import { syncFiles } from 'services/fileService'; // const inter = Inter({ subsets: ['latin'] }); export default function Home() { + const init = async () => { + const collections = await syncCollections(); + + // get requested collection id from fragment (this is temporary and will be changed during cast) + const requestedCollectionID = window.location.hash.slice(1); + + const files = await syncFiles('normal', collections, () => {}); + + console.log(files); + + if (requestedCollectionID) { + const collectionFiles = files.filter( + (file) => file.collectionID === Number(requestedCollectionID) + ); + + console.log('collectionFiles', collectionFiles); + } + }; + + useEffect(() => { + init(); + }, []); return <>; }