update remaining pages

frontend/src/components/account-settings.ts

@@ -18,6 +18,7 @@ const { PASSWORD_MINLENGTH, PASSWORD_MAXLENGTH, PASSWORD_MIN_SCORE } =
   PasswordService;
 
 @localized()
+@customElement("btrix-request-verify")
 class RequestVerify extends LitElement {
   @property({ type: String })
   email!: string;
@@ -87,7 +88,6 @@ class RequestVerify extends LitElement {
     this.isRequesting = false;
   }
 }
-customElements.define("btrix-request-verify", RequestVerify);
 
 @needLogin
 @localized()

frontend/src/pages/accept-invite.ts

@@ -1,4 +1,4 @@
-import { state, property } from "lit/decorators.js";
+import { state, property, customElement } from "lit/decorators.js";
 import { msg, str, localized } from "@lit/localize";
 
 import LiteElement, { html } from "../utils/LiteElement";
@@ -6,6 +6,7 @@ import type { AuthState } from "../utils/AuthService";
 import { ROUTES } from "../routes";
 
 @localized()
+@customElement("btrix-accept-invite")
 export class AcceptInvite extends LiteElement {
   @property({ type: Object })
   authState?: AuthState;

frontend/src/pages/crawls.ts

@@ -1,4 +1,4 @@
-import { state, property } from "lit/decorators.js";
+import { state, property, customElement } from "lit/decorators.js";
 import { when } from "lit/directives/when.js";
 import { msg, localized, str } from "@lit/localize";
 import type { SlSelect } from "@shoelace-style/shoelace";
@@ -38,6 +38,7 @@ const ABORT_REASON_THROTTLE = "throttled";
 
 @needLogin
 @localized()
+@customElement("btrix-crawls")
 export class Crawls extends LiteElement {
   @property({ type: Object })
   authState!: AuthState;

frontend/src/pages/home.ts

@@ -1,4 +1,4 @@
-import { state, property } from "lit/decorators.js";
+import { state, property, customElement } from "lit/decorators.js";
 import { ifDefined } from "lit/directives/if-defined.js";
 import { msg, localized, str } from "@lit/localize";
 import { serialize } from "@shoelace-style/shoelace/dist/utilities/form.js";
@@ -11,6 +11,7 @@ import type { APIPaginatedList } from "../types/api";
 import { maxLengthValidator } from "../utils/form";
 
 @localized()
+@customElement("btrix-home")
 export class Home extends LiteElement {
   @property({ type: Object })
   authState?: AuthState;

frontend/src/pages/index.ts

@@ -1,39 +1,12 @@
-import { Home } from "./home";
-customElements.define("btrix-home", Home);
+import "./home";
 
-import(/* webpackChunkName: "sign-up" */ "./sign-up").then(({ SignUp }) => {
-  customElements.define("btrix-sign-up", SignUp);
-});
-import(/* webpackChunkName: "log-in" */ "./log-in").then(({ LogInPage }) => {
-  customElements.define("btrix-log-in", LogInPage);
-});
-import(/* webpackChunkName: "orgs" */ "./orgs").then(({ Orgs }) => {
-  customElements.define("btrix-orgs", Orgs);
-});
-import(/* webpackChunkName: "org" */ "./org").then(({ Org }) => {
-  customElements.define("btrix-org", Org);
-});
-import(/* webpackChunkName: "crawls" */ "./crawls").then(({ Crawls }) => {
-  customElements.define("btrix-crawls", Crawls);
-});
-import(/* webpackChunkName: "join" */ "./join").then(({ Join }) => {
-  customElements.define("btrix-join", Join);
-});
-import(/* webpackChunkName: "verify" */ "./verify").then(({ Verify }) => {
-  customElements.define("btrix-verify", Verify);
-});
-import(/* webpackChunkName: "reset-password" */ "./reset-password").then(
-  ({ ResetPassword }) => {
-    customElements.define("btrix-reset-password", ResetPassword);
-  }
-);
-import(/* webpackChunkName: "users-invite" */ "./users-invite").then(
-  ({ UsersInvite }) => {
-    customElements.define("btrix-users-invite", UsersInvite);
-  }
-);
-import(/* webpackChunkName: "accept-invite" */ "./accept-invite").then(
-  ({ AcceptInvite }) => {
-    customElements.define("btrix-accept-invite", AcceptInvite);
-  }
-);
+import(/* webpackChunkName: "sign-up" */ "./sign-up");
+import(/* webpackChunkName: "log-in" */ "./log-in");
+import(/* webpackChunkName: "orgs" */ "./orgs");
+import(/* webpackChunkName: "org" */ "./org");
+import(/* webpackChunkName: "crawls" */ "./crawls");
+import(/* webpackChunkName: "join" */ "./join");
+import(/* webpackChunkName: "verify" */ "./verify");
+import(/* webpackChunkName: "reset-password" */ "./reset-password");
+import(/* webpackChunkName: "users-invite" */ "./users-invite");
+import(/* webpackChunkName: "accept-invite" */ "./accept-invite");

frontend/src/pages/join.ts

@@ -1,4 +1,4 @@
-import { state, property } from "lit/decorators.js";
+import { state, property, customElement } from "lit/decorators.js";
 import { msg, str, localized } from "@lit/localize";
 
 import LiteElement, { html } from "../utils/LiteElement";
@@ -6,6 +6,7 @@ import type { LoggedInEvent } from "../utils/AuthService";
 import AuthService from "../utils/AuthService";
 
 @localized()
+@customElement("btrix-join")
 export class Join extends LiteElement {
   @property({ type: String })
   token?: string;

frontend/src/pages/log-in.ts

@@ -1,4 +1,4 @@
-import { state, property } from "lit/decorators.js";
+import { state, property, customElement } from "lit/decorators.js";
 import { msg, localized } from "@lit/localize";
 import { createMachine, interpret, assign } from "@xstate/fsm";
 
@@ -141,6 +141,7 @@ const machine = createMachine<FormContext, FormEvent, FormTypestate>(
 );
 
 @localized()
+@customElement("btrix-log-in")
 export class LogInPage extends LiteElement {
   @property({ type: Object })
   viewState!: ViewState;

frontend/src/pages/org/index.ts

@@ -1,4 +1,4 @@
-import { state, property } from "lit/decorators.js";
+import { state, property, customElement } from "lit/decorators.js";
 import { msg, localized, str } from "@lit/localize";
 import { when } from "lit/directives/when.js";
 import { ifDefined } from "lit/directives/if-defined.js";
@@ -69,6 +69,7 @@ const UUID_REGEX =
 
 @needLogin
 @localized()
+@customElement("btrix-org")
 export class Org extends LiteElement {
   @property({ type: Object })
   authState?: AuthState;

frontend/src/pages/orgs.ts

@@ -1,4 +1,4 @@
-import { state, property } from "lit/decorators.js";
+import { state, property, customElement } from "lit/decorators.js";
 import { msg, localized } from "@lit/localize";
 
 import type { AuthState } from "../utils/AuthService";
@@ -10,6 +10,7 @@ import type { APIPaginatedList } from "../types/api";
 
 @needLogin
 @localized()
+@customElement("btrix-orgs")
 export class Orgs extends LiteElement {
   @property({ type: Object })
   authState?: AuthState;

frontend/src/pages/reset-password.ts

@@ -1,4 +1,4 @@
-import { state, property } from "lit/decorators.js";
+import { state, property, customElement } from "lit/decorators.js";
 import { str, msg, localized } from "@lit/localize";
 import debounce from "lodash/fp/debounce";
 import { when } from "lit/directives/when.js";
@@ -13,6 +13,7 @@ const { PASSWORD_MINLENGTH, PASSWORD_MAXLENGTH, PASSWORD_MIN_SCORE } =
   PasswordService;
 
 @localized()
+@customElement("btrix-reset-password")
 export class ResetPassword extends LiteElement {
   @property({ type: Object })
   viewState!: ViewState;

frontend/src/pages/sign-up.ts

@@ -1,4 +1,4 @@
-import { state, property } from "lit/decorators.js";
+import { state, property, customElement } from "lit/decorators.js";
 import { msg, localized } from "@lit/localize";
 
 import LiteElement, { html } from "../utils/LiteElement";
@@ -6,6 +6,7 @@ import type { AuthState, LoggedInEvent } from "../utils/AuthService";
 import AuthService from "../utils/AuthService";
 
 @localized()
+@customElement("btrix-sign-up")
 export class SignUp extends LiteElement {
   @property({ type: Object })
   authState?: AuthState;

frontend/src/pages/users-invite.ts

@@ -1,4 +1,4 @@
-import { state, property } from "lit/decorators.js";
+import { state, property, customElement } from "lit/decorators.js";
 import { msg, localized, str } from "@lit/localize";
 import { ifDefined } from "lit/directives/if-defined.js";
 
@@ -9,6 +9,7 @@ import { CurrentUser } from "../types/user";
 
 @needLogin
 @localized()
+@customElement("btrix-users-invite")
 export class UsersInvite extends LiteElement {
   @property({ type: Object })
   authState?: AuthState;

frontend/src/pages/verify.ts

@@ -1,10 +1,11 @@
-import { state, property } from "lit/decorators.js";
+import { state, property, customElement } from "lit/decorators.js";
 import { msg, localized } from "@lit/localize";
 
 import { AuthState } from "../utils/AuthService";
 import LiteElement, { html } from "../utils/LiteElement";
 
 @localized()
+@customElement("btrix-verify")
 export class Verify extends LiteElement {
   @property({ type: Object })
   authState?: AuthState;