Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Browse files
Browse the repository at this point in the history
## Description This PR converts the home page to React. The conversion keeps the functionality and appearance of the home page unchanged, but contains substantial changes to how these pages are composed. This is an interim step to implementing the redesign of the home page. *This PR is not intended for merge into master until the completion of the homepage revamp* ## Notes In addition to the conversion of the content of home page, this PR also converts the header and footer of the site to React, also in anticipation of the home page redesign. New React apps were added in the homepage (rendered by `homepage/main.ts`) and the base template (rendered in `base/main.ts`). To facilitate different modules independently rendering components on load, the `window.onLoad` assignments have in all modules been converted to `window.addEventListener` (without this change, only the last assigned onLoad handler is applied). We set up a system of standardized transferring of routing and translation label information from the Jinja templates to the TypeScript. The routing and translations are now rendered into respective elements in an auxiliary template that is included by the base template. These can then be read by any TypeScript module (such as a `main.ts`) and then passed through to to the relevant apps. Individual pages can still independently read their own attributes past up through the templates. ## Considerations Previously, the menu content in the headers and footers were contained directly in the templates. The move to rendering with React components presents an opportunity separate this content from the actual implementation of the header and footer, with the goal of making it easier for forks to override the content without having to make any changes to the component that implements it. We have tentatively set up a process by which the header and footer content are sent through from the backend as JSON (in a similar way to how the partners and topics are sent through to the homepage). The goal here will be to set up an easy way for a fork to provide a custom version of the header or footer in their own backend (for example, with the commonly used `_custom_dc` tag in the filename), to override in the fork without affecting the core. This could be done either in a separate PR, or following feedback and discussion, in this PR. ### Future Fork Customization Before this project is completed, we will need to consider the potential fork customization options for the new React structure of the home page (as we are no longer dealing with a scenario where a significant amount of the material to be customized lies in the template). We can consider three levels of customization that a fork might want to implement: * Content: This is the simplest customization, referred to above, where they may which to change the available menus and associated text. * Style: In this scenario, a fork may which to keep the structure of the components intact, but style the components (changing fonts, colors, and the layout to the degree that the structure allows). * Components: Here, a fork may choose to remove, edit or otherwise substantially change the components themselves. These will be considered as development of the homepage revamping progresses. --------- Co-authored-by: Nicholas Blumberg <[email protected]> Co-authored-by: Nick B <[email protected]>
- Loading branch information