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.

Sign up for GitHub

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

Jump to bottom

Change BrewRenderer background in Heroku test deployments #3688

Merged
merged 7 commits into from
Oct 11, 2024
Merged

Change BrewRenderer background in Heroku test deployments #3688

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
7 commits
Select commit Hold shift + click to select a range
cc7fe99
Initial functionality pass
G-Ambatte Aug 29, 2024
f458b98
Merge branch 'master' into experimentalDeploymentIdentification
G-Ambatte Aug 29, 2024
4291284
Merge branch 'master' into experimentalDeploymentIdentification
G-Ambatte Oct 10, 2024
5d29d40
Implement suggested change
G-Ambatte Oct 10, 2024
a9a8b4b
Shift static height style to LESS file
G-Ambatte Oct 10, 2024
9099db5
Remove obsolete state and event handlers
G-Ambatte Oct 10, 2024
d534edd
Remove unnecessary useEffect import
G-Ambatte Oct 11, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
26 changes: 9 additions & 17 deletions client/homebrew/brewRenderer/brewRenderer.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
/*eslint max-lines: ["warn", {"max": 300, "skipBlankLines": true, "skipComments": true}]*/
require('./brewRenderer.less');
const React = require('react');
const { useState, useRef, useEffect, useCallback } = React;
const { useState, useRef, useCallback } = React;
const _ = require('lodash');

const MarkdownLegacy = require('naturalcrit/markdownLegacy.js');
Expand Down Expand Up @@ -64,7 +64,6 @@ const BrewRenderer = (props)=>{
};

const [state, setState] = useState({
height : PAGE_HEIGHT,
isMounted : false,
visibility : 'hidden',
zoom : 100
Expand All @@ -78,17 +77,6 @@ const BrewRenderer = (props)=>{
rawPages = props.text.split(/^\\page$/gm);
}

useEffect(()=>{ // Unmounting steps
return ()=>{window.removeEventListener('resize', updateSize);};
}, []);

const updateSize = ()=>{
setState((prevState)=>({
...prevState,
height : mainRef.current.parentNode.clientHeight,
}));
};

const updateCurrentPage = useCallback(_.throttle((e)=>{
const { scrollTop, clientHeight, scrollHeight } = e.target;
const totalScrollableHeight = scrollHeight - clientHeight;
Expand Down Expand Up @@ -163,8 +151,6 @@ const BrewRenderer = (props)=>{

const frameDidMount = ()=>{ //This triggers when iFrame finishes internal "componentDidMount"
setTimeout(()=>{ //We still see a flicker where the style isn't applied yet, so wait 100ms before showing iFrame
updateSize();
window.addEventListener('resize', updateSize);
renderPages(); //Make sure page is renderable before showing
setState((prevState)=>({
...prevState,
Expand All @@ -187,6 +173,12 @@ const BrewRenderer = (props)=>{
}));
};

const styleObject = {};

if(global.config.deployment) {
styleObject.backgroundImage = `url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' version='1.1' height='40px' width='200px'><text x='0' y='15' fill='white' font-size='20'>${global.config.deployment}</text></svg>")`;
}

return (
<>
{/*render dummy page while iFrame is mounting.*/}
Expand All @@ -212,11 +204,11 @@ const BrewRenderer = (props)=>{
contentDidMount={frameDidMount}
onClick={()=>{emitClick();}}
>
<div className={'brewRenderer'}
<div className={`brewRenderer ${global.config.deployment && 'deployment'}`}
onScroll={updateCurrentPage}
onKeyDown={handleControlKeys}
tabIndex={-1}
style={{ height: state.height }}>
style={ styleObject }>

{/* Apply CSS from Style tab and render pages from Markdown tab */}
{state.isMounted
Expand Down
4 changes: 4 additions & 0 deletions client/homebrew/brewRenderer/brewRenderer.less
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,10 @@
overflow-y : scroll;
will-change : transform;
padding-top : 30px;
height : 100vh;
&.deployment {
background-color: darkred;
}
:where(.pages) {
margin : 30px 0px;
& > :where(.page) {
Expand Down
3 changes: 2 additions & 1 deletion server/app.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -481,7 +481,8 @@ const renderPage = async (req, res)=>{
const configuration = {
local : isLocalEnvironment,
publicUrl : config.get('publicUrl') ?? '',
environment : nodeEnv
environment : nodeEnv,
deployment : config.get('heroku_app_name') ?? ''
};
const props = {
version : require('./../package.json').version,
Expand Down