web: start implementing translation in JS

This commit is contained in:
Jens Langhammer 2020-12-01 09:46:59 +01:00
parent 0231bcf685
commit a777ecc933
9 changed files with 25 additions and 17 deletions

View File

@ -17,6 +17,7 @@
<link rel="stylesheet" type="text/css" href="{% static 'node_modules/@patternfly/patternfly/patternfly-addons.css' %}">
<link rel="stylesheet" type="text/css" href="{% static 'node_modules/@fortawesome/fontawesome-free/css/fontawesome.min.css' %}">
<link rel="stylesheet" type="text/css" href="{% static 'dist/passbook.css' %}">
<script src="{% url 'javascript-catalog' %}"></script>
<script src="{% static 'dist/main.js' %}" type="module"></script>
{% block head %}
{% endblock %}

View File

@ -5,6 +5,7 @@ from django.contrib import admin
from django.urls import include, path
from django.views.generic import RedirectView
from structlog import get_logger
from django.views.i18n import JavaScriptCatalog
from passbook.core.views import error
from passbook.lib.utils.reflection import get_apps
@ -56,6 +57,7 @@ for _passbook_app in get_apps():
urlpatterns += [
path("administration/django/", admin.site.urls),
path("metrics/", MetricsView.as_view(), name="metrics"),
path("-/jsi18n/", JavaScriptCatalog.as_view(), name='javascript-catalog'),
]
if settings.DEBUG:

View File

@ -1,3 +0,0 @@
# Ignore artifacts:
dist/
coverage

View File

@ -1,4 +0,0 @@
{
"printWidth": 100,
"jsxBracketSameLine": true
}

View File

@ -39,5 +39,6 @@ export default [
watch: {
clearScreen: false,
},
external: ['django']
},
];

10
web/src/django.d.ts vendored Normal file
View File

@ -0,0 +1,10 @@
declare module 'django' {
export = django;
}
declare namespace django {
function gettext(name: string): string;
function ngettext(singular: string, plural: string, count: number): string;
function gettext_noop(msgid: string): string;
function pgettext(context: string, msgid: string): string;
function interpolate(fmt: string, obj: any, named: boolean): string;
}

View File

@ -1,3 +1,4 @@
import { gettext } from "django";
import { html, LitElement, property, TemplateResult } from "lit-element";
import { until } from "lit-html/directives/until.js";
import { PBResponse } from "../../api/client";
@ -70,12 +71,10 @@ export abstract class Table<T> extends LitElement {
<div class="pf-c-toolbar__bulk-select">
<slot name="create-button"></slot>
<button
@click=${() => {
this.fetch();
}}
@click=${() => {this.fetch();}}
class="pf-c-button pf-m-primary"
>
Refresh
${gettext("Refresh")}
</button>
</div>
<pb-table-pagination
@ -88,7 +87,7 @@ export abstract class Table<T> extends LitElement {
<thead>
<tr role="row">
${this.columns().map(
(col) => html`<th role="columnheader" scope="col">${col}</th>`
(col) => html`<th role="columnheader" scope="col">${gettext(col)}</th>`
)}
</tr>
</thead>

View File

@ -141,7 +141,8 @@ export class RouterOutlet extends LitElement {
this.current = matchedRoute;
}
render(): TemplateResult {
render(): TemplateResult | undefined {
// TODO: Render 404 when current Route is empty
return this.current?.render();
}
}

View File

@ -1,3 +1,4 @@
import { gettext } from "django";
import { customElement } from "lit-element";
import { Application } from "../../api/application";
import { PBResponse } from "../../api/client";
@ -6,13 +7,13 @@ import { TablePage } from "../../elements/table/TablePage";
@customElement("pb-application-list")
export class ApplicationList extends TablePage<Application> {
pageTitle(): string {
return "Applications";
return gettext("Applications");
}
pageDescription(): string {
return "External Applications which use passbook as Identity-Provider, utilizing protocols like OAuth2 and SAML.";
return gettext("External Applications which use passbook as Identity-Provider, utilizing protocols like OAuth2 and SAML.");
}
pageIcon(): string {
return "pf-icon pf-icon-applications";
return gettext("pf-icon pf-icon-applications");
}
apiEndpoint(page: number): Promise<PBResponse<Application>> {