WIP: Use the js build in hugo to replace webpack

src/Components/Accordion.js → assets/js/Components/Accordion.jsx

@@ -1,4 +1,4 @@
-import { Component } from 'preact';
+import { h, Component, Fragment } from 'preact';
 import PropTypes from 'prop-types';
 
 export default class Accordion extends Component {

src/Components/ActWidget.js → assets/js/Components/ActWidget.jsx

@@ -1,6 +1,6 @@
-import { render, Component } from 'preact';
+import { h, render, Component, Fragment } from 'preact';
 import PropTypes from 'prop-types';
-import RequestGeneratorBuilder from './RequestGeneratorBuilder';
+import RequestGeneratorBuilder from './RequestGeneratorBuilder.jsx';
 import { fakeEvt } from '../Utility/common';
 import { VALID_REQUEST_TYPES } from '../Utility/requests';
 

src/Components/CommentsWidget.js → assets/js/Components/CommentsWidget.jsx

@@ -1,8 +1,8 @@
-import { Component } from 'preact';
+import { h, Component, Fragment } from 'preact';
 import { IntlProvider, Text, MarkupText } from 'preact-i18n';
-import t from 'Utility/i18n';
-import FlashMessage, { flash } from './FlashMessage';
-import StarWidget from './StarWidget';
+import t from '../Utility/i18n';
+import FlashMessage, { flash } from './FlashMessage.jsx';
+import StarWidget from './StarWidget.jsx';
 import { rethrow, WarningException } from '../Utility/errors';
 import PropTypes from 'prop-types';
 

src/Components/DonationWidget.js → assets/js/Components/DonationWidget.jsx

@@ -1,12 +1,12 @@
-import { render, Component } from 'preact';
+import { h, render, Component, Fragment } from 'preact';
 import { IntlProvider, Text, MarkupText } from 'preact-i18n';
 import { PARAMETERS, almostUniqueId, renderMoney } from '../Utility/common';
 import { CriticalException, rethrow } from '../Utility/errors';
 import t from '../Utility/i18n';
-import FlashMessage, { flash } from './FlashMessage';
-import Radio from './Radio';
+import FlashMessage, { flash } from './FlashMessage.jsx';
+import Radio from './Radio.jsx';
 import { clientPost } from '../Utility/browser';
-import LoadingIndicator from './LoadingIndicator';
+import LoadingIndicator from './LoadingIndicator.jsx';
 
 const DONATIONS_API = 'https://backend.datenanfragen.de/donation';
 const SUGGESTED_AMOUNTS = [5, 10, 15, 25, 50, 75, 100, 150, 200, 250];

src/Components/FeatureDisabledWidget.js → assets/js/Components/FeatureDisabledWidget.jsx

@@ -1,5 +1,5 @@
-import { Component } from 'preact';
-import t from 'Utility/i18n';
+import { h, Component, Fragment } from 'preact';
+import t from '../Utility/i18n';
 import PropTypes from 'prop-types';
 
 export default class FeatureDisabledWidget extends Component {

src/Components/FlashMessage.js → assets/js/Components/FlashMessage.jsx

@@ -1,4 +1,4 @@
-import { render, Component } from 'preact';
+import { h, render, Component, Fragment } from 'preact';
 import PropTypes from 'prop-types';
 import t from '../Utility/i18n';
 

src/Components/Generator/ActionButton.js → assets/js/Components/Generator/ActionButton.jsx

@@ -1,7 +1,7 @@
-import { Component } from 'preact';
+import { h, Component, Fragment } from 'preact';
 import PropTypes from 'prop-types';
 import { Text, IntlProvider } from 'preact-i18n';
-import MailtoDropdown from '../MailtoDropdown';
+import MailtoDropdown from '../MailtoDropdown.jsx';
 
 export default class ActionButton extends Component {
     render(props) {

src/Components/Generator/CompanyWidget.js → assets/js/Components/Generator/CompanyWidget.jsx

@@ -1,7 +1,7 @@
-import { Component } from 'preact';
+import { h, Component, Fragment } from 'preact';
 import t from '../../Utility/i18n';
 import { Text, IntlProvider } from 'preact-i18n';
-import Accordion from '../Accordion';
+import Accordion from '../Accordion.jsx';
 import PropTypes from 'prop-types';
 
 export default class CompanyWidget extends Component {

src/Components/Generator/DynamicInput.js → assets/js/Components/Generator/DynamicInput.jsx

@@ -1,4 +1,4 @@
-import { Component } from 'preact';
+import { h, Component, Fragment } from 'preact';
 import { Text, IntlProvider } from 'preact-i18n';
 import t from '../../Utility/i18n';
 import PropTypes from 'prop-types';

src/Components/Generator/DynamicInputContainer.js → assets/js/Components/Generator/DynamicInputContainer.jsx

@@ -1,5 +1,5 @@
-import { Component } from 'preact';
-import DynamicInput from './DynamicInput';
+import { h, Component, Fragment } from 'preact';
+import DynamicInput from './DynamicInput.jsx';
 import { Text, IntlProvider } from 'preact-i18n';
 import t from '../../Utility/i18n';
 import PropTypes from 'prop-types';

src/Components/Generator/RecipientInput.js → assets/js/Components/Generator/RecipientInput.jsx

@@ -1,5 +1,5 @@
-import { Component } from 'preact';
-import t from 'Utility/i18n';
+import { h, Component, Fragment } from 'preact';
+import t from '../../Utility/i18n';
 import { Text, IntlProvider } from 'preact-i18n';
 import PropTypes from 'prop-types';
 

src/Components/Generator/RequestForm.js → assets/js/Components/Generator/RequestForm.jsx

@@ -1,13 +1,13 @@
-import { Component } from 'preact';
-import DynamicInputContainer from './DynamicInputContainer';
-import SignatureInput from './SignatureInput';
+import { h, Component, Fragment } from 'preact';
+import DynamicInputContainer from './DynamicInputContainer.jsx';
+import SignatureInput from './SignatureInput.jsx';
 import { MarkupText, Text, IntlProvider } from 'preact-i18n';
 import t from '../../Utility/i18n';
-import { AddressControl } from './DynamicInput';
-import Accordion from '../Accordion';
-import RequestTypeChooser from './RequestTypeChooser';
-import RecipientInput from './RecipientInput';
-import TransportMediumChooser from './TransportMediumChooser';
+import { AddressControl } from './DynamicInput.jsx';
+import Accordion from '../Accordion.jsx';
+import RequestTypeChooser from './RequestTypeChooser.jsx';
+import RecipientInput from './RecipientInput.jsx';
+import TransportMediumChooser from './TransportMediumChooser.jsx';
 import PropTypes from 'prop-types';
 
 export default class RequestForm extends Component {

src/Components/Generator/RequestTypeChooser.js → assets/js/Components/Generator/RequestTypeChooser.jsx

@@ -1,6 +1,6 @@
-import { Component } from 'preact';
-import t from 'Utility/i18n';
-import Radio from '../Radio';
+import { h, Component, Fragment } from 'preact';
+import t from '../../Utility/i18n';
+import Radio from '../Radio.jsx';
 import { VALID_REQUEST_TYPES } from '../../Utility/requests';
 import PropTypes from 'prop-types';
 

src/Components/Generator/SignatureInput.js → assets/js/Components/Generator/SignatureInput.jsx

@@ -1,4 +1,4 @@
-import { Component } from 'preact';
+import { h, Component, Fragment } from 'preact';
 import { Text, IntlProvider } from 'preact-i18n';
 import { detectBlockedCanvasImageExtraction } from '../../Utility/browser';
 import PropTypes from 'prop-types';

src/Components/Generator/TransportMediumChooser.js → assets/js/Components/Generator/TransportMediumChooser.jsx

@@ -1,8 +1,8 @@
-import { Component } from 'preact';
+import { h, Component, Fragment } from 'preact';
 import PropTypes from 'prop-types';
-import t from 'Utility/i18n';
+import t from '../../Utility/i18n';
 import { Text, IntlProvider } from 'preact-i18n';
-import Radio from '../Radio';
+import Radio from '../Radio.jsx';
 
 export default class TransportMediumChooser extends Component {
     render() {

src/Components/I18nWidget.js → assets/js/Components/I18nWidget.jsx

@@ -1,8 +1,11 @@
-import { render, Component } from 'preact';
+import { h, render, Component, Fragment } from 'preact';
 import { IntlProvider, MarkupText, Text } from 'preact-i18n';
-import Modal from './Modal';
-import t from 'Utility/i18n';
+import Modal from './Modal.jsx';
+import t from '../Utility/i18n';
 import PropTypes from 'prop-types';
+import * as params from '@params';
+const SUPPORTED_LANGUAGES = params['supported_languages'];
+const SUPPORTED_COUNTRIES = params['supported_countries'];
 
 export default class I18nWidget extends Component {
     constructor(props) {

src/Components/LoadingIndicator.js → assets/js/Components/LoadingIndicator.jsx

@@ -1,4 +1,4 @@
-import { Component } from 'preact';
+import { h, Component, Fragment } from 'preact';
 import PropTypes from 'prop-types';
 
 export default class LoadingIndicator extends Component {

src/Components/MailtoDropdown.js → assets/js/Components/MailtoDropdown.jsx

@@ -1,8 +1,8 @@
-import { render, Component } from 'preact';
+import { h, render, Component, Fragment } from 'preact';
 import { Text, IntlProvider } from 'preact-i18n';
 import PropTypes from 'prop-types';
 import t, { t_r } from '../Utility/i18n';
-import Modal from './Modal';
+import Modal from './Modal.jsx';
 
 // We only want to select everything in the copymanually inputs if they aren't yet focused. That, the user can still
 // an individual selection if they prefer.
@@ -119,22 +119,22 @@ export default class MailtoDropdown extends Component {
             ),
             body: encodeURIComponent(props.letter.toEmailString()),
         };
-        const handler_buttons = handlers.map((h) => (
+        const handler_buttons = handlers.map((handler) => (
             // eslint-disable-next-line jsx-a11y/anchor-is-valid
             <a
-                href={MAILTO_HANDLERS[h].link?.(data)}
+                href={MAILTO_HANDLERS[handler].link?.(data)}
                 onClick={(e) => {
                     if (!props.letter) e.preventDefault();
                     else {
-                        if (MAILTO_HANDLERS[h].onClick) MAILTO_HANDLERS[h].onClick(data);
+                        if (MAILTO_HANDLERS[handler].onClick) MAILTO_HANDLERS[handler].onClick(data);
                         props.onSuccess();
                     }
                 }}
                 className="button button-secondary button-full-width"
                 target="_blank"
                 rel="noreferrer noopener"
                 style="margin-top: 10px;">
-                {t(h, 'mailto')}
+                {t(handler, 'mailto')}
             </a>
         ));
 

src/Components/Modal.js → assets/js/Components/Modal.jsx

@@ -1,4 +1,4 @@
-import { render, Component } from 'preact';
+import { h, render, Component, Fragment } from 'preact';
 import { createPortal } from 'preact/compat';
 import t from '../Utility/i18n';
 import PropTypes from 'prop-types';

src/Components/Radio.js → assets/js/Components/Radio.jsx

@@ -1,4 +1,4 @@
-import { Component } from 'preact';
+import { h, Component, Fragment } from 'preact';
 import PropTypes from 'prop-types';
 
 export default class Radio extends Component {

src/Components/RequestGeneratorBuilder.js → assets/js/Components/RequestGeneratorBuilder.jsx

@@ -1,4 +1,4 @@
-import { Component } from 'preact';
+import { h, Component, Fragment } from 'preact';
 import { IntlProvider, MarkupText } from 'preact-i18n';
 import t, { t_r } from '../Utility/i18n';
 import Request from '../DataType/Request';
@@ -13,15 +13,15 @@ import {
 import RequestLetter from '../Utility/RequestLetter';
 import { slugify, PARAMETERS } from '../Utility/common';
 import SavedIdData, { ID_DATA_CHANGE_EVENT, ID_DATA_CLEAR_EVENT } from '../Utility/SavedIdData';
-import replacer_factory from '../Utility/request-generator-replacers';
+import replacer_factory from '../Utility/request-generator-replacers.jsx';
 import { fetchCompanyDataBySlug } from '../Utility/companies';
 import Privacy, { PRIVACY_ACTIONS } from '../Utility/Privacy';
-import Modal, { showModal, dismissModal } from './Modal';
-import SvaFinder from './SvaFinder';
+import Modal, { showModal, dismissModal } from './Modal.jsx';
+import SvaFinder from './SvaFinder.jsx';
 import { clearUrlParameters } from '../Utility/browser';
 import Template from 'letter-generator/Template';
-import UserRequests from '../my-requests';
-import ActionButton from './Generator/ActionButton';
+import UserRequests from '../my-requests.jsx';
+import ActionButton from './Generator/ActionButton.jsx';
 import PropTypes from 'prop-types';
 
 export default class RequestGeneratorBuilder extends Component {

src/Components/SearchBar.js → assets/js/Components/SearchBar.jsx

@@ -1,10 +1,10 @@
-import { Component } from 'preact';
+import { h, Component, Fragment } from 'preact';
 import { IntlProvider, MarkupText } from 'preact-i18n';
 import t from '../Utility/i18n';
 import Privacy, { PRIVACY_ACTIONS } from '../Utility/Privacy';
 import * as Typesense from 'typesense';
 import { rethrow } from '../Utility/errors';
-import FeatureDisabledWidget from './FeatureDisabledWidget';
+import FeatureDisabledWidget from './FeatureDisabledWidget.jsx';
 import PropTypes from 'prop-types';
 
 export let SearchBar;

src/Components/StarWidget.js → assets/js/Components/StarWidget.jsx

@@ -1,4 +1,4 @@
-import { Component } from 'preact';
+import { h, Component, Fragment } from 'preact';
 import PropTypes from 'prop-types';
 
 // Adapted after https://jsfiddle.net/leaverou/CGP87/

src/Components/SvaFinder.js → assets/js/Components/SvaFinder.jsx

@@ -1,5 +1,5 @@
-import { render, Component } from 'preact';
-import t from 'Utility/i18n';
+import { h, render, Component, Fragment } from 'preact';
+import t from '../Utility/i18n';
 import { fetchSvaDataBySlug } from '../Utility/companies';
 import PropTypes from 'prop-types';
 

src/Components/Wizard.js → assets/js/Components/Wizard.jsx

@@ -1,7 +1,7 @@
-import { Component } from 'preact';
+import { h, Component, Fragment } from 'preact';
 import t from '../Utility/i18n';
 import { Text, MarkupText, IntlProvider } from 'preact-i18n';
-import { SearchBar } from './SearchBar';
+import { SearchBar } from './SearchBar.jsx';
 import { rethrow } from '../Utility/errors';
 import localforage from 'localforage';
 import Cookie from 'js-cookie';

src/DataType/Request.js → assets/js/DataType/Request.js

@@ -1,7 +1,7 @@
 import { generateReference } from 'letter-generator/utility';
 import { deepCopyObject } from '../Utility/common';
 import { defaultFields, REQUEST_FALLBACK_LANGUAGE } from '../Utility/requests';
-import UserRequests from '../my-requests';
+import UserRequests from '../my-requests.jsx';
 
 /**
  * @typedef {"access" | "erasure" | "rectification" | "objection" | "custom"} RequestType

src/Utility/RequestLetter.js → assets/js/Utility/RequestLetter.js

@@ -3,8 +3,6 @@ import { formatAddress, stripTags } from 'letter-generator/utility';
 import Letter from 'letter-generator/Letter';
 import Template from 'letter-generator/Template';
 import { rethrow } from './errors';
-// eslint-disable-next-line import/default
-import PdfWorker from './pdf.worker';
 
 /**
  * Callback with the generated PDF letter.
@@ -73,7 +71,9 @@ export default class RequestLetter {
      */
     initiatePdfGeneration(filename) {
         if (!this.pdfWorker) {
-            this.pdfWorker = new PdfWorker();
+            // This is defined during the build with hugo.
+            // eslint-disable-next-line no-undef
+            this.pdfWorker = new Worker(PDF_WORKER_URL);
             if (window.hugoDevMode) {
                 // copy the worker to window if we are in a dev env to enable easy testing
                 window.pdfWorker = this.pdfWorker;

src/Utility/request-generator-replacers.js → assets/js/Utility/request-generator-replacers.jsx

@@ -1,4 +1,5 @@
 // eslint-disable-next-line no-unused-vars
+import { h, Component, Fragment } from 'preact';
 import { Text } from 'preact-i18n';
 import t from '../Utility/i18n';
 

src/company-list.js → assets/js/company-list.jsx

@@ -1,10 +1,10 @@
-import { render, Component } from 'preact';
-import { SearchBar } from 'Components/SearchBar';
+import { h, render, Component, Fragment } from 'preact';
+import { SearchBar } from './Components/SearchBar.jsx';
 import { IntlProvider, Text } from 'preact-i18n';
 import PropTypes from 'prop-types';
 
-import t from 'Utility/i18n';
-import Privacy, { PRIVACY_ACTIONS } from 'Utility/Privacy';
+import t from './Utility/i18n';
+import Privacy, { PRIVACY_ACTIONS } from './Utility/Privacy';
 import Scrollspy from 'react-scrollspy';
 
 if (!Privacy.isAllowed(PRIVACY_ACTIONS.SEARCH) && document.getElementById('aa-search-input'))

src/error-handler.js → assets/js/error-handler.js

@@ -1,3 +1,5 @@
+const I18N_DEFINITION = require('./i18n/' + LOCALE + '.json');
+
 // Our email hoster Uberspace has a spam filter that cannot be disabled and that doesn't like JSON. We have had problems
 // in the past with error reports being marked as spam and not being delivered to us. Thus, we employ this function to
 // make our JSON look as little like JSON as possible.

src/general.js → assets/js/general.jsx

@@ -1,14 +1,17 @@
-import { render } from 'preact';
-import I18nWidget, { I18nButton } from './Components/I18nWidget';
-import CommentsWidget from './Components/CommentsWidget';
+import { h, render, Fragment } from 'preact';
+import I18nWidget, { I18nButton } from './Components/I18nWidget.jsx';
+import CommentsWidget from './Components/CommentsWidget.jsx';
 import Cookie from 'js-cookie';
 import { PARAMETERS } from './Utility/common';
+import * as params from '@params';
 
 // has to run before any rendering, webpack will remove this if the condition is false
 if (process.env.NODE_ENV === 'development') {
     require('preact/debug');
 }
 
+window.I18N_DEFINITION = require('./i18n/' + LOCALE + '.json');
+
 window.PARAMETERS = PARAMETERS;
 
 Object.defineProperty(globals, 'country', {
@@ -62,5 +65,5 @@ function guessUserCountry() {
     if (!navigator_lang || !bcp47_country) return FALLBACK_COUNTRIES[LOCALE];
 
     // If however we *can* guess the country but just don't support it, we show all companies.
-    return SUPPORTED_COUNTRIES.includes(bcp47_country) ? bcp47_country : 'all';
+    return params['supported_countries'].includes(bcp47_country) ? bcp47_country : 'all';
 }

src/generator.js → assets/js/generator.jsx

@@ -1,15 +1,15 @@
-import { render, Component } from 'preact';
+import { h, render, Component, Fragment } from 'preact';
 import { IntlProvider } from 'preact-i18n';
 import { PARAMETERS } from './Utility/common';
 import { clearUrlParameters } from './Utility/browser';
 import t from './Utility/i18n';
 import Joyride from 'react-joyride';
-import { tutorial_steps } from './wizard-tutorial.js';
+import { tutorial_steps } from './wizard-tutorial.jsx';
 import Cookie from 'js-cookie';
-import RequestGeneratorBuilder from './Components/RequestGeneratorBuilder';
+import RequestGeneratorBuilder from './Components/RequestGeneratorBuilder.jsx';
 import Privacy, { PRIVACY_ACTIONS } from './Utility/Privacy';
-import { SavedCompanies } from './Components/Wizard';
-import Modal, { showModal, dismissModal } from './Components/Modal';
+import { SavedCompanies } from './Components/Wizard.jsx';
+import Modal, { showModal, dismissModal } from './Components/Modal.jsx';
 
 const HIDE_IN_WIZARD_MODE = [
     '.search',