Do not embed the templates and static files in the binary

templates/components/back_to_client.html

@@ -0,0 +1,30 @@
+{#
+Copyright 2021 The Matrix.org Foundation C.I.C.
+
+Licensed under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License.
+You may obtain a copy of the License at
+
+    http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+#}
+
+{% macro link(text, class="", uri, mode, params) %}
+  {% if mode == "form_post" %}
+    <form method="post" action="{{ uri }}">
+      {% for key, value in params %}
+        <input type="hidden" name="{{ key }}" value="{{ value }}" />
+      {% endfor %}
+      <button class="{{ class }}" type="submit">{{ text }}</button>
+    </form>
+  {% elif mode == "fragment" or mode == "query" %}
+    <a class="{{ class }}" href="{{ add_params_to_uri(uri=uri, mode=mode, params=params) }}">{{ text }}</a>
+  {% else %}
+    {{ throw(message="Invalid mode") }}
+  {% endif %}
+{% endmacro %}

templates/components/button.html

@@ -0,0 +1,63 @@
+{#
+Copyright 2021 The Matrix.org Foundation C.I.C.
+
+Licensed under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License.
+You may obtain a copy of the License at
+
+    http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+#}
+
+{% macro common_class() -%}
+  px-4 py-2 border-2 rounded-lg font-medium text-center focus:ring-0 focus:outline-0 focus:border-black dark:focus:border-white
+{%- endmacro %}
+
+{% macro plain_error_class() -%}
+  {{ self::common_class() }} border-alert bg-alert text-white hover:opacity-75
+{%- endmacro %}
+
+{% macro outline_error_class() -%}
+  {{ self::common_class() }} border-alert text-alert hover:bg-alert/10
+{%- endmacro %}
+
+{% macro plain_class() -%}
+  {{ self::common_class() }} border-accent bg-accent text-white hover:opacity-75
+{%- endmacro %}
+
+{% macro outline_class() -%}
+  {{ self::common_class() }} border-accent hover:bg-accent/10 text-accent
+{%- endmacro %}
+
+{% macro text_class() -%}
+  {{ self::common_class() }} border-transparent hover:text-accent/70 text-accent
+{%- endmacro %}
+
+{% macro link(text, href="#", class="") %}
+  <a class="{{ self::plain_class() }} {{ class }}" href="{{ href }}">{{ text }}</a>
+{% endmacro %}
+
+{% macro link_text(text, href="#", class="") %}
+  <a class="{{ self::text_class() }} {{ class }}" href="{{ href }}">{{ text }}</a>
+{% endmacro %}
+
+{% macro link_outline(text, href="#", class="") %}
+  <a class="{{ self::outline_class() }} {{ class }}" href="{{ href }}">{{ text }}</a>
+{% endmacro %}
+
+{% macro button(text, name="", type="submit", class="", value="") %}
+  <button name="{{ name }}" value="{{ value }}" type="{{ type }}" class="{{ self::plain_class() }} {{ class }}">{{ text }}</button>
+{% endmacro %}
+
+{% macro button_text(text, name="", type="submit", class="", value="") %}
+  <button name="{{ name }}" value="{{ value }}" type="{{ type }}" class="{{ self::text_class() }} {{ class }}">{{ text }}</button>
+{% endmacro %}
+
+{% macro button_outline(text, name="", type="submit", class="", value="") %}
+  <button name="{{ name }}" value="{{ value }}" type="{{ type }}" class="{{ self::outline_class() }} {{ class }}">{{ text }}</button>
+{% endmacro %}

templates/components/errors.html

@@ -0,0 +1,25 @@
+{#
+Copyright 2022 The Matrix.org Foundation C.I.C.
+
+Licensed under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License.
+You may obtain a copy of the License at
+
+    http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+#}
+
+{% macro form_error_message(error) -%}
+  {% if error.kind == "invalid_credentials" %}
+    Invalid credentials
+  {% elif error.kind == "password_mismatch" %}
+    Password fields don't match 
+  {% else %}
+    {{ error.kind }}
+  {% endif %}
+{%- endmacro %}

templates/components/field.html

@@ -0,0 +1,62 @@
+{#
+Copyright 2021, 2022 The Matrix.org Foundation C.I.C.
+
+Licensed under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License.
+You may obtain a copy of the License at
+
+    http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+#}
+
+{% macro input(label, name, type="text", form_state=false, autocomplete=false, class="", inputmode="text", autocorrect=false, autocapitalize=false) %}
+  {% if not form_state %}
+    {% set form_state = dict(errors=[], fields=dict()) %}
+  {% endif %}
+
+  {% set state = form_state.fields[name] | default(value=dict(errors=[], value="")) %}
+
+  {% if state.errors is not empty %}
+    {% set border_color = "border-alert" %}
+    {% set text_color = "text-alert" %}
+  {% else %}
+    {% set border_color = "border-grey-50 dark:border-grey-450" %}
+    {% set text_color = "text-black-800 dark:text-grey-300" %}
+  {% endif %}
+
+  <label class="flex flex-col block {{ class }}">
+    <div class="mx-2 -mb-3 -mt-2 leading-5 px-1 z-10 self-start bg-white dark:bg-black-900 border-white border-1 dark:border-2 dark:border-black-900 rounded-full text-sm {{ text_color }}">{{ label }}</div>
+    <input name="{{ name }}"
+      class="z-0 px-3 py-2 bg-white dark:bg-black-900 rounded-lg {{ border_color }} border-1 dark:border-2 focus:border-accent focus:ring-0 focus:outline-0"
+      type="{{ type }}" 
+      inputmode="{{ inputmode }}"
+      {% if autocomplete %} autocomplete="{{ autocomplete }}" {% endif %} 
+      {% if state.value %} value="{{ state.value }}" {% endif %}  
+      {% if autocorrect %} autocorrect="{{ autocorrect }}" {% endif %} 
+      {% if autocapitalize %} autocapitalize="{{ autocapitalize }}" {% endif %} 
+      />
+
+    {% if state.errors is not empty %}
+      {% for error in state.errors %}
+        {% if error.kind != "unspecified" %}
+          <div class="mx-4 text-sm text-alert">
+            {% if error.kind == "required" %}
+              This field is required
+            {% elif error.kind == "exists" and name == "username" %}
+              This username is already taken
+            {% elif error.kind == "policy" %}
+              Denied by policy: {{ error.message }}
+            {% else %}
+              {{ error.kind }}
+            {% endif %}
+          </div>
+        {% endif %}
+      {% endfor %}
+    {% endif %}
+  </label>
+{% endmacro input %}

templates/components/logout.html

@@ -0,0 +1,28 @@
+{#
+Copyright 2022 The Matrix.org Foundation C.I.C.
+
+Licensed under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License.
+You may obtain a copy of the License at
+
+    http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+#}
+
+{% macro button(text, class="", csrf_token, post_logout_action=false) %}
+  <form method="POST" action="/logout" class="inline">
+    <input type="hidden" name="csrf" value="{{ csrf_token }}" />
+    {% if post_logout_action %}
+      {% for key, value in post_logout_action %}
+        <input type="hidden" name="{{ key }}" value="{{ value }}" />
+      {% endfor %}
+    {% endif %}
+    <button class="{{ class }}" type="submit">{{ text }}</button>
+  </form>
+{% endmacro %}
+

templates/components/navbar.html

@@ -0,0 +1,35 @@
+{#
+Copyright 2022 The Matrix.org Foundation C.I.C.
+
+Licensed under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License.
+You may obtain a copy of the License at
+
+    http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+#}
+
+{% macro top() %}
+  <nav class="container mx-auto py-2 flex-initial flex items-center px-2" role="navigation" aria-label="main navigation">
+    <div class="flex-1"></div>
+
+    <div class="grid grid-flow-col auto-cols-max gap-4 place-items-center">
+      {% if current_session %}
+        <div class="text-grey-200 dark:text-grey-250 mx-2">
+          Signed in as <span class="font-bold">{{ current_session.user.username }}</span>.
+        </div>
+
+        {{ button::link(text="My account", href="/account") }}
+        {{ logout::button(text="Sign out", class=button::outline_class(), csrf_token=csrf_token) }}
+      {% else %}
+        {{ button::link(text="Sign in", href="/login") }}
+        {{ button::link_outline(text="Create an account", href="/register") }}
+      {% endif %}
+    </div>
+  </nav>
+{% endmacro top %}