web: switch to eslint
This commit is contained in:
		@ -9,7 +9,7 @@ interface TickValue {
 | 
			
		||||
@customElement("pb-admin-logins-chart")
 | 
			
		||||
export class AdminLoginsChart extends LitElement {
 | 
			
		||||
    @property()
 | 
			
		||||
    url: string = "";
 | 
			
		||||
    url = "";
 | 
			
		||||
 | 
			
		||||
    chart: any;
 | 
			
		||||
 | 
			
		||||
@ -43,7 +43,7 @@ export class AdminLoginsChart extends LitElement {
 | 
			
		||||
            .then((r) => r.json())
 | 
			
		||||
            .catch((e) => console.error(e))
 | 
			
		||||
            .then((r) => {
 | 
			
		||||
                let ctx = (<HTMLCanvasElement>this.shadowRoot?.querySelector("canvas")).getContext(
 | 
			
		||||
                const ctx = (<HTMLCanvasElement>this.shadowRoot?.querySelector("canvas")).getContext(
 | 
			
		||||
                    "2d"
 | 
			
		||||
                )!;
 | 
			
		||||
                this.chart = new Chart(ctx, {
 | 
			
		||||
 | 
			
		||||
@ -10,10 +10,10 @@ import "codemirror/mode/python/python.js";
 | 
			
		||||
@customElement("pb-codemirror")
 | 
			
		||||
export class CodeMirrorTextarea extends LitElement {
 | 
			
		||||
    @property()
 | 
			
		||||
    readOnly: boolean = false;
 | 
			
		||||
    readOnly = false;
 | 
			
		||||
 | 
			
		||||
    @property()
 | 
			
		||||
    mode: string = "yaml";
 | 
			
		||||
    mode = "yaml";
 | 
			
		||||
 | 
			
		||||
    editor?: CodeMirror.EditorFromTextArea;
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
@ -7,16 +7,16 @@ interface ComparisonHash {
 | 
			
		||||
@customElement("fetch-fill-slot")
 | 
			
		||||
export class FetchFillSlot extends LitElement {
 | 
			
		||||
    @property()
 | 
			
		||||
    url: string = "";
 | 
			
		||||
    url = "";
 | 
			
		||||
 | 
			
		||||
    @property()
 | 
			
		||||
    key: string = "";
 | 
			
		||||
    key = "";
 | 
			
		||||
 | 
			
		||||
    @property()
 | 
			
		||||
    value: string = "";
 | 
			
		||||
    value = "";
 | 
			
		||||
 | 
			
		||||
    comparison(slotName: string) {
 | 
			
		||||
        let comparisonOperatorsHash = <ComparisonHash>{
 | 
			
		||||
        const comparisonOperatorsHash = <ComparisonHash>{
 | 
			
		||||
            "<": function (a: any, b: any) {
 | 
			
		||||
                return a < b;
 | 
			
		||||
            },
 | 
			
		||||
 | 
			
		||||
@ -7,7 +7,7 @@ const LEVEL_ICON_MAP: { [key: string]: string } = {
 | 
			
		||||
    info: "fas fa-info",
 | 
			
		||||
};
 | 
			
		||||
 | 
			
		||||
let ID = function (prefix: string) {
 | 
			
		||||
const ID = function (prefix: string) {
 | 
			
		||||
    return prefix + Math.random().toString(36).substr(2, 9);
 | 
			
		||||
};
 | 
			
		||||
 | 
			
		||||
@ -20,10 +20,10 @@ interface Message {
 | 
			
		||||
@customElement("pb-messages")
 | 
			
		||||
export class Messages extends LitElement {
 | 
			
		||||
    @property()
 | 
			
		||||
    url: string = "";
 | 
			
		||||
    url = "";
 | 
			
		||||
 | 
			
		||||
    messageSocket?: WebSocket;
 | 
			
		||||
    retryDelay: number = 200;
 | 
			
		||||
    retryDelay = 200;
 | 
			
		||||
 | 
			
		||||
    createRenderRoot() {
 | 
			
		||||
        return this;
 | 
			
		||||
@ -72,7 +72,7 @@ export class Messages extends LitElement {
 | 
			
		||||
     * This mostly gets messages which were created when the user arrives/leaves the site
 | 
			
		||||
     * and especially the login flow */
 | 
			
		||||
    fetchMessages() {
 | 
			
		||||
        console.debug(`passbook/messages: fetching messages over direct api`);
 | 
			
		||||
        console.debug("passbook/messages: fetching messages over direct api");
 | 
			
		||||
        return fetch(this.url)
 | 
			
		||||
            .then((r) => r.json())
 | 
			
		||||
            .then((r) => {
 | 
			
		||||
@ -93,8 +93,8 @@ export class Messages extends LitElement {
 | 
			
		||||
        const el = document.createElement("template");
 | 
			
		||||
        el.innerHTML = `<li id=${id} class="pf-c-alert-group__item">
 | 
			
		||||
            <div class="pf-c-alert pf-m-${message.levelTag} ${
 | 
			
		||||
            message.levelTag === "error" ? "pf-m-danger" : ""
 | 
			
		||||
        }">
 | 
			
		||||
    message.levelTag === "error" ? "pf-m-danger" : ""
 | 
			
		||||
}">
 | 
			
		||||
                <div class="pf-c-alert__icon">
 | 
			
		||||
                    <i class="${LEVEL_ICON_MAP[message.levelTag]}"></i>
 | 
			
		||||
                </div>
 | 
			
		||||
 | 
			
		||||
@ -15,7 +15,7 @@ export class Tabs extends LitElement {
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    render() {
 | 
			
		||||
        let pages = Array.from(this.querySelectorAll("[slot]")!);
 | 
			
		||||
        const pages = Array.from(this.querySelectorAll("[slot]")!);
 | 
			
		||||
        if (!this.currentPage) {
 | 
			
		||||
            if (pages.length < 1) {
 | 
			
		||||
                return html`<h1>no tabs defined</h1>`;
 | 
			
		||||
@ -25,24 +25,24 @@ export class Tabs extends LitElement {
 | 
			
		||||
        return html`<div class="pf-c-tabs">
 | 
			
		||||
                <ul class="pf-c-tabs__list">
 | 
			
		||||
                    ${pages.map((page) => {
 | 
			
		||||
                        const slot = page.attributes.getNamedItem("slot")?.value;
 | 
			
		||||
                        return html` <li
 | 
			
		||||
        const slot = page.attributes.getNamedItem("slot")?.value;
 | 
			
		||||
        return html` <li
 | 
			
		||||
                            class="pf-c-tabs__item ${slot === this.currentPage
 | 
			
		||||
                                ? CURRENT_CLASS
 | 
			
		||||
                                : ""}"
 | 
			
		||||
        ? CURRENT_CLASS
 | 
			
		||||
        : ""}"
 | 
			
		||||
                        >
 | 
			
		||||
                            <button
 | 
			
		||||
                                class="pf-c-tabs__link"
 | 
			
		||||
                                @click=${() => {
 | 
			
		||||
                                    this.currentPage = slot;
 | 
			
		||||
                                }}
 | 
			
		||||
        this.currentPage = slot;
 | 
			
		||||
    }}
 | 
			
		||||
                            >
 | 
			
		||||
                                <span class="pf-c-tabs__item-text">
 | 
			
		||||
                                    ${page.attributes.getNamedItem("tab-title")?.value}
 | 
			
		||||
                                </span>
 | 
			
		||||
                            </button>
 | 
			
		||||
                        </li>`;
 | 
			
		||||
                    })}
 | 
			
		||||
    })}
 | 
			
		||||
                </ul>
 | 
			
		||||
            </div>
 | 
			
		||||
            <slot name="${this.currentPage}"></slot>`;
 | 
			
		||||
 | 
			
		||||
@ -6,7 +6,7 @@ import { SpinnerButton } from "./SpinnerButton";
 | 
			
		||||
@customElement("pb-action-button")
 | 
			
		||||
export class ActionButton extends SpinnerButton {
 | 
			
		||||
    @property()
 | 
			
		||||
    url: string = "";
 | 
			
		||||
    url = "";
 | 
			
		||||
 | 
			
		||||
    callAction() {
 | 
			
		||||
        if (this.isRunning === true) {
 | 
			
		||||
 | 
			
		||||
@ -20,7 +20,7 @@ export class ModalButton extends LitElement {
 | 
			
		||||
    href?: string;
 | 
			
		||||
 | 
			
		||||
    @property()
 | 
			
		||||
    open: boolean = false;
 | 
			
		||||
    open = false;
 | 
			
		||||
 | 
			
		||||
    static get styles() {
 | 
			
		||||
        return [
 | 
			
		||||
@ -79,7 +79,7 @@ export class ModalButton extends LitElement {
 | 
			
		||||
        this.querySelectorAll<HTMLFormElement>("[slot=modal] form").forEach((form) => {
 | 
			
		||||
            form.addEventListener("submit", (e) => {
 | 
			
		||||
                e.preventDefault();
 | 
			
		||||
                let formData = new FormData(form);
 | 
			
		||||
                const formData = new FormData(form);
 | 
			
		||||
                fetch(this.href ? this.href : form.action, {
 | 
			
		||||
                    method: form.method,
 | 
			
		||||
                    body: formData,
 | 
			
		||||
@ -91,11 +91,11 @@ export class ModalButton extends LitElement {
 | 
			
		||||
                    .then((data) => {
 | 
			
		||||
                        if (data.indexOf("csrfmiddlewaretoken") !== -1) {
 | 
			
		||||
                            this.querySelector("[slot=modal]")!.innerHTML = data;
 | 
			
		||||
                            console.debug(`passbook/modalbutton: re-showing form`);
 | 
			
		||||
                            console.debug("passbook/modalbutton: re-showing form");
 | 
			
		||||
                            this.updateHandlers();
 | 
			
		||||
                        } else {
 | 
			
		||||
                            this.open = false;
 | 
			
		||||
                            console.debug(`passbook/modalbutton: successful submit`);
 | 
			
		||||
                            console.debug("passbook/modalbutton: successful submit");
 | 
			
		||||
                            this.dispatchEvent(
 | 
			
		||||
                                new CustomEvent("hashchange", {
 | 
			
		||||
                                    bubbles: true,
 | 
			
		||||
 | 
			
		||||
@ -70,7 +70,7 @@ export class SpinnerButton extends LitElement {
 | 
			
		||||
            @click=${() => this.callAction()}
 | 
			
		||||
        >
 | 
			
		||||
            ${this.isRunning
 | 
			
		||||
                ? html` <span class="pf-c-button__progress">
 | 
			
		||||
        ? html` <span class="pf-c-button__progress">
 | 
			
		||||
                      <span
 | 
			
		||||
                          class="pf-c-spinner pf-m-md"
 | 
			
		||||
                          role="progressbar"
 | 
			
		||||
@ -81,7 +81,7 @@ export class SpinnerButton extends LitElement {
 | 
			
		||||
                          <span class="pf-c-spinner__tail-ball"></span>
 | 
			
		||||
                      </span>
 | 
			
		||||
                  </span>`
 | 
			
		||||
                : ""}
 | 
			
		||||
        : ""}
 | 
			
		||||
            <slot></slot>
 | 
			
		||||
        </button>`;
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
@ -181,15 +181,15 @@ export class Sidebar extends LitElement {
 | 
			
		||||
            class="pf-c-nav__item ${item.children ? "pf-m-expandable pf-m-expanded" : ""}"
 | 
			
		||||
        >
 | 
			
		||||
            ${item.path
 | 
			
		||||
                ? html`<a
 | 
			
		||||
        ? html`<a
 | 
			
		||||
                      href="#${item.path}"
 | 
			
		||||
                      class="pf-c-nav__link ${item.path.some((v) => v === this.activePath)
 | 
			
		||||
                          ? "pf-m-current"
 | 
			
		||||
                          : ""}"
 | 
			
		||||
        ? "pf-m-current"
 | 
			
		||||
        : ""}"
 | 
			
		||||
                  >
 | 
			
		||||
                      ${item.name}
 | 
			
		||||
                  </a>`
 | 
			
		||||
                : html`<a class="pf-c-nav__link" aria-expanded="true"
 | 
			
		||||
        : html`<a class="pf-c-nav__link" aria-expanded="true"
 | 
			
		||||
                          >${item.name}
 | 
			
		||||
                          <span class="pf-c-nav__toggle">
 | 
			
		||||
                              <i class="fas fa-angle-right" aria-hidden="true"></i>
 | 
			
		||||
 | 
			
		||||
@ -48,8 +48,8 @@ export class SidebarBrand extends LitElement {
 | 
			
		||||
            <div class="pf-c-brand pb-brand">
 | 
			
		||||
                <img src="${this.config?.branding_logo}" alt="passbook icon" loading="lazy" />
 | 
			
		||||
                ${this.config?.branding_title
 | 
			
		||||
                    ? html`<span>${this.config.branding_title}</span>`
 | 
			
		||||
                    : ""}
 | 
			
		||||
        ? html`<span>${this.config.branding_title}</span>`
 | 
			
		||||
        : ""}
 | 
			
		||||
            </div>
 | 
			
		||||
        </a>`;
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
@ -12,7 +12,7 @@ export abstract class Table<T> extends LitElement {
 | 
			
		||||
    data?: PBResponse<T>;
 | 
			
		||||
 | 
			
		||||
    @property()
 | 
			
		||||
    page: number = 1;
 | 
			
		||||
    page = 1;
 | 
			
		||||
 | 
			
		||||
    static get styles() {
 | 
			
		||||
        return [COMMON_STYLES];
 | 
			
		||||
@ -51,12 +51,12 @@ export abstract class Table<T> extends LitElement {
 | 
			
		||||
            return;
 | 
			
		||||
        }
 | 
			
		||||
        return this.data.results.map((item) => {
 | 
			
		||||
            const fullRow = [`<tr role="row">`].concat(
 | 
			
		||||
            const fullRow = ["<tr role=\"row\">"].concat(
 | 
			
		||||
                this.row(item).map((col) => {
 | 
			
		||||
                    return `<td role="cell">${col}</td>`;
 | 
			
		||||
                })
 | 
			
		||||
            );
 | 
			
		||||
            fullRow.push(`</tr>`);
 | 
			
		||||
            fullRow.push("</tr>");
 | 
			
		||||
            return html(<any>fullRow);
 | 
			
		||||
        });
 | 
			
		||||
    }
 | 
			
		||||
@ -71,8 +71,8 @@ export abstract class Table<T> extends LitElement {
 | 
			
		||||
                        <slot name="create-button"></slot>
 | 
			
		||||
                        <button
 | 
			
		||||
                            @click=${() => {
 | 
			
		||||
                                this.fetch();
 | 
			
		||||
                            }}
 | 
			
		||||
        this.fetch();
 | 
			
		||||
    }}
 | 
			
		||||
                            class="pf-c-button pf-m-primary"
 | 
			
		||||
                        >
 | 
			
		||||
                            Refresh
 | 
			
		||||
@ -88,8 +88,8 @@ 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">${col}</th>`
 | 
			
		||||
    )}
 | 
			
		||||
                    </tr>
 | 
			
		||||
                </thead>
 | 
			
		||||
                <tbody role="rowgroup">
 | 
			
		||||
 | 
			
		||||
@ -13,7 +13,7 @@ export class TablePagination extends LitElement {
 | 
			
		||||
 | 
			
		||||
    previousHandler() {
 | 
			
		||||
        if (!this.table?.data?.pagination.previous) {
 | 
			
		||||
            console.debug(`passbook/tables: no previous`);
 | 
			
		||||
            console.debug("passbook/tables: no previous");
 | 
			
		||||
            return;
 | 
			
		||||
        }
 | 
			
		||||
        this.table.page = this.table?.data?.pagination.previous;
 | 
			
		||||
@ -21,7 +21,7 @@ export class TablePagination extends LitElement {
 | 
			
		||||
 | 
			
		||||
    nextHandler() {
 | 
			
		||||
        if (!this.table?.data?.pagination.next) {
 | 
			
		||||
            console.debug(`passbook/tables: no next`);
 | 
			
		||||
            console.debug("passbook/tables: no next");
 | 
			
		||||
            return;
 | 
			
		||||
        }
 | 
			
		||||
        this.table.page = this.table?.data?.pagination.next;
 | 
			
		||||
@ -44,8 +44,8 @@ export class TablePagination extends LitElement {
 | 
			
		||||
                        <button
 | 
			
		||||
                            class="pf-c-button pf-m-plain"
 | 
			
		||||
                            @click=${() => {
 | 
			
		||||
                                this.previousHandler();
 | 
			
		||||
                            }}
 | 
			
		||||
        this.previousHandler();
 | 
			
		||||
    }}
 | 
			
		||||
                            disabled="${this.table?.data?.pagination.previous ? "true" : "false"}"
 | 
			
		||||
                            aria-label="{% trans 'Go to previous page' %}"
 | 
			
		||||
                        >
 | 
			
		||||
@ -56,8 +56,8 @@ export class TablePagination extends LitElement {
 | 
			
		||||
                        <button
 | 
			
		||||
                            class="pf-c-button pf-m-plain"
 | 
			
		||||
                            @click=${() => {
 | 
			
		||||
                                this.nextHandler();
 | 
			
		||||
                            }}
 | 
			
		||||
        this.nextHandler();
 | 
			
		||||
    }}
 | 
			
		||||
                            disabled="${this.table?.data?.pagination.next ? "true" : "false"}"
 | 
			
		||||
                            aria-label="{% trans 'Go to next page' %}"
 | 
			
		||||
                        >
 | 
			
		||||
 | 
			
		||||
		Reference in New Issue
	
	Block a user