f.weber/homebrewery
0
0
Fork 0
mirror of https://github.com/naturalcrit/homebrewery.git synced 2026-03-22 08:58:11 +00:00
Code Wiki Activity

trying to get this to work

Browse Source
This commit is contained in:
Víctor Losada Hernández
2026-02-01 20:37:09 +01:00
parent 215d24b99a
commit b5598ac423
9 changed files with 65 additions and 66 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
client/homebrew/brewRenderer/brewRenderer.jsx
View File

@@ -11,8 +11,7 @@ import ToolBar from './toolBar/toolBar.jsx';
//TODO: move to the brew renderer //TODO: move to the brew renderer
import RenderWarnings from '../../components/renderWarnings/renderWarnings.jsx'; import RenderWarnings from '../../components/renderWarnings/renderWarnings.jsx';
import NotificationPopup from './notificationPopup/notificationPopup.jsx'; import NotificationPopup from './notificationPopup/notificationPopup.jsx';
import frameComp from 'react-frame-component'; import Frame from 'react-frame-component';
const Frame = frameComp.default;
import dedent from 'dedent'; import dedent from 'dedent';
import { printCurrentBrew } from '../../../shared/helpers.js'; import { printCurrentBrew } from '../../../shared/helpers.js';

44
client/homebrew/homebrew.jsx
View File

@@ -1,7 +1,7 @@
import 'core-js/es/string/to-well-formed.js'; // Polyfill for older browsers import 'core-js/es/string/to-well-formed.js'; // Polyfill for older browsers
import './homebrew.less'; import './homebrew.less';
import React, { useState, useEffect } from 'react'; import React, { useState, useEffect } from 'react';
import { BrowserRouter as Router, Routes, Route, useParams, useSearchParams } from 'react-router-dom'; import { BrowserRouter as Router, Routes, Route, useParams, useSearchParams } from 'react-router';
import { updateLocalStorage } from './utils/updateLocalStorage/updateLocalStorageKeys.js'; import { updateLocalStorage } from './utils/updateLocalStorage/updateLocalStorageKeys.js';
@@ -21,31 +21,27 @@ const WithRoute = ({ el: Element, ...rest })=>{
return <Element {...rest} {...params} query={queryParams} />; return <Element {...rest} {...params} query={queryParams} />;
}; };
const Homebrew = ()=>{ const Homebrew = (props)=>{
// SPA defaults / client-side state // SPA defaults / client-side state
const [account, setAccount] = useState(null); const {
const [version] = useState('0.0.0'); url = '',
const [config, setConfig] = useState({}); version = '0.0.0',
const [brew, setBrew] = useState({ account = null,
title : '', config,
text : '', brew = {
shareId : null, title : '',
editId : null, text : '',
createdAt : null, shareId : null,
updatedAt : null, editId : null,
lang : '' createdAt : null,
}); updatedAt : null,
const [userThemes, setUserThemes] = useState([]); lang : ''
const [brews, setBrews] = useState([]); },
userThemes,
brews
} = props;
// Maybe should fetch the data here? console.log('props: ', props);
//probably should fetch the object later
// useEffect(() => { fetch('/api/...').then(res => res.json()).then(setBrew) }, []);
// Set globals if needed (legacy)
global.account = account;
global.version = version;
global.config = config;
const backgroundObject = ()=>{ const backgroundObject = ()=>{
if(config?.deployment || (config?.local && config?.development)) { if(config?.deployment || (config?.local && config?.development)) {

12
client/homebrew/main.jsx
View File

@@ -1,9 +1,7 @@
import { createRoot } from "react-dom/client"; import { createRoot } from "react-dom/client";
import { BrowserRouter } from "react-router-dom"; import Homebrew from "./homebrew.jsx";
import App from "./App";
createRoot(document.getElementById("reactRoot")).render( const props = window.__INITIAL_PROPS__ || {};
<BrowserRouter> console.log('props: ', window.__INITIAL_PROPS__);
<App />
</BrowserRouter> createRoot(document.getElementById("reactRoot")).render(<Homebrew {...props} />);
);

2
client/index.html → index.html
View File

@@ -24,6 +24,6 @@
<body> <body>
<main id="reactRoot"></main> <main id="reactRoot"></main>
<script type="module" src="/src/homebrewMain.jsx"></script> <script type="module" src="/client/homebrew/main.jsx"></script>
</body> </body>
</html> </html>

20
package-lock.json generated
View File

@@ -3959,9 +3959,9 @@
"license": "MIT" "license": "MIT"
}, },
"node_modules/@types/node": { "node_modules/@types/node": {
"version": "25.1.0", "version": "25.2.0",
"resolved": "https://registry.npmjs.org/@types/node/-/node-25.1.0.tgz", "resolved": "https://registry.npmjs.org/@types/node/-/node-25.2.0.tgz",
"integrity": "sha512-t7frlewr6+cbx+9Ohpl0NOTKXZNV9xHRmNOvql47BFJKcEG1CxtxlPEEe+gR9uhVWM4DwhnvTF110mIL4yP9RA==", "integrity": "sha512-DZ8VwRFUNzuqJ5khrvwMXHmvPe+zGayJhr2CDNiKB1WBE1ST8Djl00D0IC4vvNmHMdj6DlbYRIaFE7WHjlDl5w==",
"devOptional": true, "devOptional": true,
"license": "MIT", "license": "MIT",
"peer": true, "peer": true,
@@ -12647,22 +12647,22 @@
} }
}, },
"node_modules/tldts": { "node_modules/tldts": {
"version": "7.0.19", "version": "7.0.21",
"resolved": "https://registry.npmjs.org/tldts/-/tldts-7.0.19.tgz", "resolved": "https://registry.npmjs.org/tldts/-/tldts-7.0.21.tgz",
"integrity": "sha512-8PWx8tvC4jDB39BQw1m4x8y5MH1BcQ5xHeL2n7UVFulMPH/3Q0uiamahFJ3lXA0zO2SUyRXuVVbWSDmstlt9YA==", "integrity": "sha512-Plu6V8fF/XU6d2k8jPtlQf5F4Xx2hAin4r2C2ca7wR8NK5MbRTo9huLUWRe28f3Uk8bYZfg74tit/dSjc18xnw==",
"dev": true, "dev": true,
"license": "MIT", "license": "MIT",
"dependencies": { "dependencies": {
"tldts-core": "^7.0.19" "tldts-core": "^7.0.21"
}, },
"bin": { "bin": {
"tldts": "bin/cli.js" "tldts": "bin/cli.js"
} }
}, },
"node_modules/tldts-core": { "node_modules/tldts-core": {
"version": "7.0.19", "version": "7.0.21",
"resolved": "https://registry.npmjs.org/tldts-core/-/tldts-core-7.0.19.tgz", "resolved": "https://registry.npmjs.org/tldts-core/-/tldts-core-7.0.21.tgz",
"integrity": "sha512-lJX2dEWx0SGH4O6p+7FPwYmJ/bu1JbcGJ8RLaG9b7liIgZ85itUVEPbMtWRVrde/0fnDPEPHW10ZsKW3kVsE9A==", "integrity": "sha512-oVOMdHvgjqyzUZH1rOESgJP1uNe2bVrfK0jUHHmiM2rpEiRbf3j4BrsIc6JigJRbHGanQwuZv/R+LTcHsw+bLA==",
"dev": true, "dev": true,
"license": "MIT" "license": "MIT"
}, },

5
package.json
View File

@@ -12,11 +12,10 @@
"url": "git://github.com/naturalcrit/homebrewery.git" "url": "git://github.com/naturalcrit/homebrewery.git"
}, },
"scripts": { "scripts": {
"dev":"node server.js", "dev": "vite",
"build": "vite build && node scripts/compileAssets.js", "build": "vite build && node scripts/compileAssets.js",
"start": "node server.js", "preview": "vite preview",
"compileAssets": "node scripts/compileAssets.js --dev", "compileAssets": "node scripts/compileAssets.js --dev",
"lint": "eslint --fix", "lint": "eslint --fix",
"lint:dry": "eslint", "lint:dry": "eslint",
"stylelint": "stylelint --fix **/*.{less}", "stylelint": "stylelint --fix **/*.{less}",

5
server.js
View File

@@ -8,7 +8,6 @@ const isProd = process.env.NODE_ENV === "production";
async function start() { async function start() {
let vite; let vite;
//==== Create Vite dev server only in development ====//
if (!isProd) { if (!isProd) {
vite = await createViteServer({ vite = await createViteServer({
server: { middlewareMode: true }, server: { middlewareMode: true },
@@ -17,16 +16,13 @@ async function start() {
} }
//==== Connect to the database ====//
await DB.connect(config).catch((err) => { await DB.connect(config).catch((err) => {
console.error("Database connection failed:", err); console.error("Database connection failed:", err);
process.exit(1); process.exit(1);
}); });
//==== Create the Express app ====//
const app = await createApp(vite); const app = await createApp(vite);
//==== Start listening ====//
const PORT = process.env.PORT || config.get("web_port") || 8000; const PORT = process.env.PORT || config.get("web_port") || 8000;
app.listen(PORT, () => { app.listen(PORT, () => {
const reset = "\x1b[0m"; // Reset to default style const reset = "\x1b[0m"; // Reset to default style
@@ -42,5 +38,4 @@ async function start() {
}); });
} }
//==== Start the server ====//
start(); start();

34
server/app.js
View File

@@ -12,9 +12,9 @@ import _ from 'lodash';
import jwt from 'jwt-simple'; import jwt from 'jwt-simple';
import express from 'express'; import express from 'express';
import config from './config.js'; import config from './config.js';
import path from 'path';
import fs from 'fs-extra'; import fs from 'fs-extra';
import api from './homebrew.api.js'; import api from './homebrew.api.js';
const { homebrewApi, getBrew, getUsersBrewThemes, getCSS } = api; const { homebrewApi, getBrew, getUsersBrewThemes, getCSS } = api;
import adminApi from './admin.api.js'; import adminApi from './admin.api.js';
@@ -23,7 +23,6 @@ import GoogleActions from './googleActions.js';
import serveCompressedStaticAssets from './static-assets.mv.js'; import serveCompressedStaticAssets from './static-assets.mv.js';
import sanitizeFilename from 'sanitize-filename'; import sanitizeFilename from 'sanitize-filename';
import asyncHandler from 'express-async-handler'; import asyncHandler from 'express-async-handler';
import template from '../client/template.js';
import { model as HomebrewModel } from './homebrew.model.js'; import { model as HomebrewModel } from './homebrew.model.js';
import { DEFAULT_BREW } from './brewDefaults.js'; import { DEFAULT_BREW } from './brewDefaults.js';
@@ -545,7 +544,8 @@ export default async function createApp(vite) {
//Send rendered page //Send rendered page
app.use(asyncHandler(async (req, res, next)=>{ app.use(asyncHandler(async (req, res, next)=>{
if(!req.route) return res.redirect('/'); // Catch-all for invalid routes console.log(req.route);
//if(!req.route) return res.redirect('/'); // Catch-all for invalid routes
const page = await renderPage(req, res); const page = await renderPage(req, res);
if(!page) return; if(!page) return;
@@ -554,6 +554,7 @@ export default async function createApp(vite) {
//Render the page //Render the page
const renderPage = async (req, res)=>{ const renderPage = async (req, res)=>{
console.log('renderpage');
// Create configuration object // Create configuration object
const configuration = { const configuration = {
local : isLocalEnvironment, local : isLocalEnvironment,
@@ -573,18 +574,25 @@ export default async function createApp(vite) {
ogMeta : req.ogMeta, ogMeta : req.ogMeta,
userThemes : req.userThemes userThemes : req.userThemes
}; };
const title = req.brew ? req.brew.title : ''; console.log('props: ',props);
return await renderSPA(req, props);
};
const page = await template( const renderSPA = async (req, props)=>{
isProd ? {} : { vite, url: req.originalUrl }, const htmlPath = isProd ? path.resolve('build', 'index.html') : path.resolve('index.html');
'homebrew', let html = fs.readFileSync(htmlPath, 'utf-8');
title, console.log('index.html snippet:', html.slice(0, 200)); // see the first 200 chars
props html = html.replace(
).catch((err)=>{ '</head>',
console.error(err); `<script>window.__INITIAL_PROPS__ = ${JSON.stringify(props)}</script>\n</head>`
}); );
return page; if(!isProd && vite?.transformIndexHtml) {
console.log('transforming');
return await vite.transformIndexHtml(req.originalUrl, html);
}
return html;
}; };
//v=====----- Error-Handling Middleware -----=====v// //v=====----- Error-Handling Middleware -----=====v//

6
vite.config.js
View File

@@ -20,8 +20,12 @@ export default defineConfig({
}, },
}, },
}, },
// vite.config.js
define: {
global: "window",
},
server: { server: {
port:8000, port: 8000,
fs: { fs: {
allow: ["."], allow: ["."],
}, },