profiles: add ability to directly edit profile JSON

allows for customizing small things, like changing admin status.
2026-01-18 16:47:42 +01:00 · 2025-11-28 15:13:46 +00:00
parent f83695190d
commit 77d2ad3b6b
14 changed files with 172 additions and 17 deletions
--- a/14
+++ b/14
@@ -160,18 +160,24 @@ $(VARIANTS_TARGET): $(VARIANTS_SRC)

 ICON_SRC = node_modules/remixicon/fonts/remixicon.css node_modules/remixicon/fonts/remixicon.woff2
 ICON_TARGET = $(ICON_SRC:node_modules/remixicon/fonts/%=$(DATA)/web/css/%)
-SYNTAX_SRC = node_modules/highlight.js/styles/default.min.css
-SYNTAX_TARGET = $(DATA)/web/css/$(CSSVERSION)highlightjs.css
+SYNTAX_LIGHT_SRC = node_modules/highlight.js/styles/base16/atelier-sulphurpool-light.min.css
+SYNTAX_LIGHT_TARGET = $(DATA)/web/css/$(CSSVERSION)highlightjs-light.css
+SYNTAX_DARK_SRC = node_modules/highlight.js/styles/base16/circus.min.css
+SYNTAX_DARK_TARGET = $(DATA)/web/css/$(CSSVERSION)highlightjs-dark.css
+CODEINPUT_SRC = node_modules/@webcoder49/code-input/code-input.min.css
+CODEINPUT_TARGET = $(DATA)/web/css/$(CSSVERSION)code-input.css
 CSS_SRC = $(wildcard css/*.css)
 CSS_TARGET = $(DATA)/web/css/part-bundle.css
 CSS_FULLTARGET = $(CSS_BUNDLE)
-ALL_CSS_SRC = $(ICON_SRC) $(CSS_SRC) $(SYNTAX_SRC)
+ALL_CSS_SRC = $(ICON_SRC) $(CSS_SRC) $(SYNTAX_LIGHT_SRC) $(SYNTAX_DARK_SRC)
 ALL_CSS_TARGET = $(ICON_TARGET)

 $(CSS_FULLTARGET): $(TYPESCRIPT_TARGET) $(VARIANTS_TARGET) $(ALL_CSS_SRC) $(wildcard html/*.html)
 	$(info copying fonts)
 	cp -r node_modules/remixicon/fonts/remixicon.css node_modules/remixicon/fonts/remixicon.woff2 $(DATA)/web/css/
-	cp -r $(SYNTAX_SRC) $(SYNTAX_TARGET)
+	cp -r $(SYNTAX_LIGHT_SRC) $(SYNTAX_LIGHT_TARGET)
+	cp -r $(SYNTAX_DARK_SRC) $(SYNTAX_DARK_TARGET)
+	cp -r $(CODEINPUT_SRC) $(CODEINPUT_TARGET)
 	$(info bundling css)
 	rm -f $(CSS_TARGET) $(CSS_FULLTARGET)
 	$(ESBUILD) --bundle css/base.css --outfile=$(CSS_TARGET) --external:remixicon.css --external:../fonts/hanken* --minify
--- a/api-profiles.go
+++ b/api-profiles.go
@@ -2,6 +2,7 @@ package main

 import (
 	"fmt"
+	"net/http"
 	"net/url"
 	"time"

@@ -77,7 +78,7 @@ func (app *appContext) GetProfiles(gc *gin.Context) {
 // @Param name path string true "name of profile (url encoded if necessary)"
 // @Router /profiles/raw/{name} [get]
 // @Security Bearer
-// @tags Users
+// @tags Profiles & Settings
 func (app *appContext) GetRawProfile(gc *gin.Context) {
 	escapedName := gc.Param("name")
 	name, err := url.QueryUnescape(escapedName)
@@ -95,7 +96,8 @@ func (app *appContext) GetRawProfile(gc *gin.Context) {
 // @Summary Update the raw data of a profile (Configuration, Policy, Jellyseerr/Ombi if applicable, etc.).
 // @Produce json
 // @Param ProfileDTO body ProfileDTO true "Raw profile data (all of it, do not omit anything)"
-// @Success 200 {object} boolResponse
+// @Success 204 {object} boolResponse
+// @Success 201 {object} boolResponse
 // @Failure 400 {object} boolResponse
 // @Router /profiles/raw/{name} [put]
 // @Security Bearer
@@ -118,6 +120,7 @@ func (app *appContext) ReplaceRawProfile(gc *gin.Context) {
 	if req.Name == "" {
 		req.Name = name
 	}
+	status := http.StatusNoContent
 	app.storage.SetProfileKey(req.Name, existingProfile)
 	if req.Name != name {
 		// Name change
@@ -125,8 +128,9 @@ func (app *appContext) ReplaceRawProfile(gc *gin.Context) {
 		if discordEnabled {
 			app.discord.UpdateCommands()
 		}
+		status = http.StatusCreated
 	}
-	respondBool(200, true, gc)
+	respondBool(status, true, gc)
 }

 // @Summary Set the default profile to use.
--- a/css/base.css
+++ b/css/base.css
@@ -235,7 +235,7 @@ sup.\~critical, .text-critical {
    margin-bottom: 0.25rem;
 }

-.textarea {
+.textarea:not(code-input *) {
    resize: vertical;
 }

@@ -247,7 +247,7 @@ sup.\~critical, .text-critical {
    overflow-y: visible;
 }

-select, textarea {
+select, textarea:not(code-input *) {
    color: inherit;
    border: 0 solid var(--color-neutral-300);
    appearance: none;
@@ -255,7 +255,7 @@ select, textarea {
    -moz-appearance: none;
 }

-html.dark textarea {
+html.dark textarea:not(code-input *) {
    background-color: #202020
 }

@@ -313,7 +313,7 @@ p.top {
    bottom: 115%;
 }

-pre {
+pre:not(code-input *) {
    white-space: pre-wrap;       /* css-3 */
    white-space: -moz-pre-wrap;  /* Mozilla, since 1999 */
    white-space: -pre-wrap;      /* Opera 4-6 */
--- a/html/admin.html
+++ b/html/admin.html
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
 <html lang="en" class="{{ .cssClass }}">
    <head>
+        {{ template "syntaxhighlighting.html" . }}
        <script>
            window.usernameEnabled = {{ .username }};
            window.langFile = JSON.parse({{ .language }});
@@ -445,6 +446,7 @@
                                {{ end }}
                                <th>{{ .strings.from }}</th>
                                <th>{{ .strings.userProfilesLibraries }}</th>
+                                <th></th>
                                <th><span class="button ~neutral @high" id="button-profile-create">{{ .strings.create }}</span></th>
                            </tr>
                        </thead>
@@ -453,6 +455,17 @@
                </div>
            </div>
        </div>
+        <div id="modal-edit-profile" class="modal">
+            <form class="relative mx-auto my-[10%] w-11/12 sm:w-4/5 lg:w-2/3 card flex flex-col gap-2" id="form-edit-profile">
+                <span class="heading">{{ .strings.editProfile }} <span class="modal-close">&times;</span></span>
+                <p class="content">{{ .strings.editProfileDescription }}</p>
+                <div id="modal-edit-profile-editor"></div>
+                <label>
+                    <input type="submit" class="unfocused">
+                    <span class="button ~urge @low full-width center supra submit">{{ .strings.submit }}</span>
+                </label>
+            </form>
+        </div>
        <div id="modal-add-profile" class="modal">
            <form class="card relative mx-auto my-[10%] w-11/12 sm:w-4/5 lg:w-1/3" id="form-add-profile" href="">
                <span class="heading">{{ .strings.addProfile }} <span class="modal-close">&times;</span></span>
--- a/html/syntaxhighlighting.html
+++ b/html/syntaxhighlighting.html
@@ -0,0 +1,3 @@
+<link rel="stylesheet" type="text/css" href="{{ .pages.Base }}/css/{{ .cssVersion }}highlightjs-light.css" data-theme="light">
+<link rel="stylesheet" type="text/css" href="{{ .pages.Base }}/css/{{ .cssVersion }}highlightjs-dark.css" data-theme="dark">
+<link rel="stylesheet" type="text/css" href="{{ .pages.Base }}/css/{{ .cssVersion }}code-input.css">
--- a/lang/admin/en-us.json
+++ b/lang/admin/en-us.json
@@ -39,6 +39,8 @@
        "commitNoun": "Commit",
        "newUser": "New User",
        "profile": "Profile",
+        "editProfile": "Edit profile",
+        "editProfileDescription": "For large changes, it is recommended you modify settings in Jellyfin/Jellyseerr/Ombi and re-generate the profile, but you can also make direct changes here. Please use caution when editing.",
        "unknown": "Unknown",
        "label": "Label",
        "userLabel": "User Label",
@@ -241,6 +243,7 @@
        "errorBlankFields": "Fields were left blank",
        "errorDeleteProfile": "Failed to delete profile {n}",
        "errorLoadProfiles": "Failed to load profiles.",
+        "errorLoadProfile": "Failed to load profile.",
        "errorCreateProfile": "Failed to create profile {n}",
        "errorSavedProfile": "Failed to save profile {n}",
        "errorSetDefaultProfile": "Failed to set default profile.",
@@ -258,6 +261,7 @@
        "errorNoReferralTemplate": "Profile doesn't contain referral template, add one in settings.",
        "errorLoadActivities": "Failed to load activities.",
        "errorInvalidDate": "Date is invalid.",
+        "errorInvalidJSON": "Invalid JSON.",
        "updateAvailable": "A new update is available, check settings.",
        "noUpdatesAvailable": "No new updates available."
    },
--- a/package-lock.json
+++ b/package-lock.json
@@ -12,11 +12,13 @@
        "@af-utils/scrollend-polyfill": "^0.0.14",
        "@ts-stack/markdown": "^1.4.0",
        "@types/node": "^20.3.0",
+        "@webcoder49/code-input": "^2.7.2",
        "a17t": "^0.10.1",
        "any-date-parser": "^1.5.4",
        "browserslist": "^4.21.7",
        "cheerio": "^1.0.0-rc.12",
        "fs-cheerio": "^3.0.0",
+        "highlight.js": "^11.11.1",
        "inline-source": "^8.0.2",
        "jsdom": "^22.1.0",
        "lodash": "^4.17.21",
@@ -629,6 +631,12 @@
        "undici-types": "~6.21.0"
      }
    },
+    "node_modules/@webcoder49/code-input": {
+      "version": "2.7.2",
+      "resolved": "https://registry.npmjs.org/@webcoder49/code-input/-/code-input-2.7.2.tgz",
+      "integrity": "sha512-rW+bDCDhXJuUUS1+NMazYfHuaxgClcayEPbTXWsitqb0gRpyBaY2T83RM//YhRHzHPUYL4bX8hWU+zkj2u4LiA==",
+      "license": "MIT"
+    },
    "node_modules/a17t": {
      "version": "0.10.1",
      "resolved": "https://registry.npmjs.org/a17t/-/a17t-0.10.1.tgz",
@@ -1125,6 +1133,7 @@
        }
      ],
      "license": "MIT",
+      "peer": true,
      "dependencies": {
        "caniuse-lite": "^1.0.30001726",
        "electron-to-chromium": "^1.5.173",
@@ -2928,6 +2937,15 @@
        "he": "bin/he"
      }
    },
+    "node_modules/highlight.js": {
+      "version": "11.11.1",
+      "resolved": "https://registry.npmjs.org/highlight.js/-/highlight.js-11.11.1.tgz",
+      "integrity": "sha512-Xwwo44whKBVCYoliBQwaPvtd/2tYFkRQtXDWj1nackaV2JPXx3L0+Jvd8/qCJ2p+ML0/XVkJ2q+Mr+UVdpJK5w==",
+      "license": "BSD-3-Clause",
+      "engines": {
+        "node": ">=12.0.0"
+      }
+    },
    "node_modules/html-encoding-sniffer": {
      "version": "3.0.0",
      "resolved": "https://registry.npmjs.org/html-encoding-sniffer/-/html-encoding-sniffer-3.0.0.tgz",
@@ -5180,6 +5198,7 @@
        }
      ],
      "license": "MIT",
+      "peer": true,
      "dependencies": {
        "nanoid": "^3.3.11",
        "picocolors": "^1.1.1",
@@ -5536,6 +5555,7 @@
      "integrity": "sha512-MsvtOrfG9ZcrOwAW+Qi+F6HbD0CWXEh9ou77uOb7FM2WPhwT7smM833PzanhJLsgXjN89Ir6V2PczXNnMpwKhw==",
      "deprecated": "request has been deprecated, see https://github.com/request/request/issues/3142",
      "license": "Apache-2.0",
+      "peer": true,
      "dependencies": {
        "aws-sign2": "~0.7.0",
        "aws4": "^1.8.0",
@@ -6526,6 +6546,7 @@
      "resolved": "https://registry.npmjs.org/tailwindcss/-/tailwindcss-3.4.17.tgz",
      "integrity": "sha512-w33E2aCvSDP0tW9RZuNXadXlkHXqFzSkQew/aIa2i/Sj8fThxwovwlXHSPXTbAHwEIhBFXAedUhP2tueAKP8Og==",
      "license": "MIT",
+      "peer": true,
      "dependencies": {
        "@alloc/quick-lru": "^5.2.0",
        "arg": "^5.0.2",
--- a/package.json
+++ b/package.json
@@ -20,11 +20,13 @@
    "@af-utils/scrollend-polyfill": "^0.0.14",
    "@ts-stack/markdown": "^1.4.0",
    "@types/node": "^20.3.0",
+    "@webcoder49/code-input": "^2.7.2",
    "a17t": "^0.10.1",
    "any-date-parser": "^1.5.4",
    "browserslist": "^4.21.7",
    "cheerio": "^1.0.0-rc.12",
    "fs-cheerio": "^3.0.0",
+    "highlight.js": "^11.11.1",
    "inline-source": "^8.0.2",
    "jsdom": "^22.1.0",
    "lodash": "^4.17.21",
--- a/ts/admin.ts
+++ b/ts/admin.ts
@@ -58,6 +58,8 @@ window.availableProfiles = window.availableProfiles || [];
    window.modals.profiles = new Modal(document.getElementById("modal-user-profiles"));

    window.modals.addProfile = new Modal(document.getElementById("modal-add-profile"));
+    
+    window.modals.editProfile = new Modal(document.getElementById("modal-edit-profile"));

    window.modals.announce = new Modal(document.getElementById("modal-announce"));
    
--- a/ts/modules/common.ts
+++ b/ts/modules/common.ts
@@ -85,10 +85,10 @@ export const _upload = (url: string, formData: FormData): void => {
    req.send(formData);
 };

-export const _post = (url: string, data: Object, onreadystatechange: (req: XMLHttpRequest) => void, response?: boolean, statusHandler?: (req: XMLHttpRequest) => void, noConnectionError: boolean = false): void => {
+export const _req = (method: string, url: string, data: Object, onreadystatechange: (req: XMLHttpRequest) => void, response?: boolean, statusHandler?: (req: XMLHttpRequest) => void, noConnectionError: boolean = false): void => {
    let req = new XMLHttpRequest();
    if (window.pages) { url = window.pages.Base + url; }
-    req.open("POST", url, true);
+    req.open(method, url, true);
    if (response) {
        req.responseType = 'json';
    }
@@ -107,6 +107,10 @@ export const _post = (url: string, data: Object, onreadystatechange: (req: XMLHt
    req.send(JSON.stringify(data));
 };

+export const _post = (url: string, data: Object, onreadystatechange: (req: XMLHttpRequest) => void, response?: boolean, statusHandler?: (req: XMLHttpRequest) => void, noConnectionError: boolean = false): void => _req("POST", url, data, onreadystatechange, response, statusHandler, noConnectionError);
+
+export const _put = (url: string, data: Object, onreadystatechange: (req: XMLHttpRequest) => void, response?: boolean, statusHandler?: (req: XMLHttpRequest) => void, noConnectionError: boolean = false): void => _req("PUT", url, data, onreadystatechange, response, statusHandler, noConnectionError);
+
 export function _delete(url: string, data: Object, onreadystatechange: (req: XMLHttpRequest) => void, noConnectionError: boolean = false): void {
    let req = new XMLHttpRequest();
    if (window.pages) { url = window.pages.Base + url; }
--- a/ts/modules/profiles.ts
+++ b/ts/modules/profiles.ts
@@ -1,4 +1,14 @@
-import { _get, _post, _delete, toggleLoader } from "../modules/common.js";
+import { _get, _post, _delete, toggleLoader, _put } from "../modules/common.js";
+import hljs from "highlight.js/lib/core";
+import json from 'highlight.js/lib/languages/json';
+import codeInput, { CodeInput } from "@webcoder49/code-input/code-input.mjs";
+import Template from "@webcoder49/code-input/templates/hljs.mjs";
+import Indent from "@webcoder49/code-input/plugins/indent.mjs";
+
+hljs.registerLanguage("json", json);
+codeInput.registerTemplate("json-highlighted",
+                           new Template(hljs, [new Indent()])
+                          );

 declare var window: GlobalWindow;

@@ -32,6 +42,7 @@ class profile implements Profile {
    private _defaultRadio: HTMLInputElement;
    private _referralsButton: HTMLSpanElement;
    private _referralsEnabled: boolean;
+    private _editButton: HTMLButtonElement;

    get name(): string { return this._name.textContent; }
    set name(v: string) { this._name.textContent = v; }
@@ -119,6 +130,7 @@ class profile implements Profile {
        innerHTML += `
            <td class="profile-from truncate"></td>
            <td class="profile-libraries"></td>
+            <td><button class="button ~neutral @low flex flex-row gap-2 profile-edit"><i class="ri-edit-line"></i>${window.lang.strings("edit")}</button></td> 
            <td><span class="button ~critical @low">${window.lang.strings("delete")}</span></td>
        `;
        this._row.innerHTML = innerHTML;
@@ -132,6 +144,7 @@ class profile implements Profile {
        if (window.referralsEnabled)
            this._referralsButton = this._row.querySelector("span.profile-referrals") as HTMLSpanElement;
        this._fromUser = this._row.querySelector("td.profile-from") as HTMLTableDataCellElement;
+        this._editButton = this._row.querySelector(".profile-edit") as HTMLButtonElement;
        this._defaultRadio = this._row.querySelector("input[type=radio]") as HTMLInputElement;
        this._defaultRadio.onclick = () => document.dispatchEvent(new CustomEvent("profiles-default", { detail: this.name }));
        (this._row.querySelector("span.\\~critical") as HTMLSpanElement).onclick = this.delete;
@@ -152,6 +165,7 @@ class profile implements Profile {
    setOmbiFunc = (ombiFunc: (ombi: boolean) => void) => { this._ombiButton.onclick = () => ombiFunc(this._ombi); }
    setJellyseerrFunc = (jellyseerrFunc: (jellyseerr: boolean) => void) => { this._jellyseerrButton.onclick = () => jellyseerrFunc(this._jellyseerr); }
    setReferralFunc = (referralFunc: (enabled: boolean) => void) => { this._referralsButton.onclick = () => referralFunc(this._referralsEnabled); }
+    setEditFunc = (editFunc: (name: string) => void) => { this._editButton.onclick = () => editFunc(this.name); }

    remove = () => { document.dispatchEvent(new CustomEvent("profiles-delete", { detail: this._name })); this._row.remove(); }

@@ -262,6 +276,7 @@ export class ProfileEditor {
                                    }
                                });
                            }
+                            this._profiles[name].setEditFunc(this._loadProfileEditor);
                            this._table.appendChild(this._profiles[name].asElement());
                        }
                    }
@@ -331,6 +346,64 @@ export class ProfileEditor {
        window.modals.enableReferralsProfile.show();
    };

+    private _loadProfileEditor = (name: string) => {
+        const urlSafeName = encodeURIComponent(encodeURIComponent(name));
+        _get("/profiles/raw/" + urlSafeName, null, (req: XMLHttpRequest) => {
+            if (req.readyState != 4) return;
+            if (req.status != 200) {
+                window.notifications.customError("errorLoadProfile", window.lang.notif("errorLoadProfile"));
+                return;
+            }
+            const editorContainer = document.getElementById("modal-edit-profile-editor");
+            const editor = document.createElement("code-input") as CodeInput;
+            editor.setAttribute("template", "json-highlighted");
+            editor.setAttribute("language", "json");
+            editor.classList.add("rounded-sm");
+            editor.value = JSON.stringify(req.response, null, 2);
+            editorContainer.replaceChildren(editor);
+
+            const form = document.getElementById("form-edit-profile") as HTMLFormElement;
+            const submit = form.querySelector("input[type=submit]").nextElementSibling;
+            form.onsubmit = (event: SubmitEvent) => {
+                event.preventDefault();
+                let send: any;
+                try {
+                    send = JSON.parse(editor.value);
+                } catch(e: any) {
+                    submit.classList.add("~critical");
+                    submit.classList.remove("~urge");
+                    window.notifications.customError("errorInvalidJSON", window.lang.notif("errorInvalidJSON"));
+                    setTimeout(() => {
+                        submit.classList.add("~urge");
+                        submit.classList.remove("~critical");
+                    }, 2000);
+                }
+                if (!send) return;
+                _put("/profiles/raw/" + urlSafeName, send, (req: XMLHttpRequest) => {
+                    if (req.readyState != 4) return;
+                    if (req.status == 200 || req.status == 201 || req.status == 204) {
+                        window.notifications.customSuccess("savedProfile", window.lang.notif("savedProfile"));
+                        // a 201 implies the profile was renamed. Since reloading profiles doesn't delete missing ones,
+                        // we should delete the old one ourselves.
+                        if (req.status == 201) {
+                            this._profiles[name].remove()
+                            delete this._profiles[name];
+                        }
+                    } else {
+                        window.notifications.customError("errorSavedProfile", window.lang.notif("errorSavedProfile"));
+                    }
+                    window.modals.editProfile.close();
+                    // Reload with new info from edits
+                    this.load();
+                });
+            };
+
+            window.modals.profiles.close();
+            window.modals.editProfile.show();
+        })
+
+    }
+
    constructor() {
        (document.getElementById('setting-profiles') as HTMLSpanElement).onclick = this.load;
        document.addEventListener("profiles-default", (event: CustomEvent) => {
--- a/ts/modules/theme.ts
+++ b/ts/modules/theme.ts
@@ -2,6 +2,10 @@ export class ThemeManager {

    private _themeButton: HTMLElement = null;
    private _metaTag: HTMLMetaElement;
+       
+    private _cssLightFiles: HTMLLinkElement[];
+    private _cssDarkFiles: HTMLLinkElement[];
+
    
    private _beforeTransition = () => {
        const doc = document.documentElement;
@@ -47,6 +51,11 @@ export class ThemeManager {

    constructor(button?: HTMLElement) {
        this._metaTag = document.querySelector("meta[name=color-scheme]") as HTMLMetaElement;
+    
+        this._cssLightFiles = Array.from(document.head.querySelectorAll("link[data-theme=light]")) as Array<HTMLLinkElement>;
+        this._cssDarkFiles = Array.from(document.head.querySelectorAll("link[data-theme=dark]")) as Array<HTMLLinkElement>;
+        this._cssLightFiles.forEach((el) => el.remove());
+        this._cssDarkFiles.forEach((el) => el.remove());
        const theme = localStorage.getItem("theme");
        if (theme == "dark") {
            this._enable(true);
@@ -63,11 +72,16 @@ export class ThemeManager {
    private _toggle = () => {
        let metaValue = "light dark";
        this._beforeTransition();
-        if (!document.documentElement.classList.contains('dark')) {
+        const dark = !document.documentElement.classList.contains("dark");
+        if (dark) {
            document.documentElement.classList.add('dark');
            metaValue = "dark light";
+            this._cssLightFiles.forEach((el) => el.remove());
+            this._cssDarkFiles.forEach((el) => document.head.appendChild(el));
        } else {
            document.documentElement.classList.remove('dark');
+            this._cssDarkFiles.forEach((el) => el.remove());
+            this._cssLightFiles.forEach((el) => document.head.appendChild(el));
        }
        localStorage.setItem('theme', document.documentElement.classList.contains('dark') ? "dark" : "light");
        
@@ -86,7 +100,14 @@ export class ThemeManager {
            document.documentElement.classList.remove(opposite);
        }
        document.documentElement.classList.add(mode);
-
+       
+        if (dark) {
+            this._cssLightFiles.forEach((el) => el.remove());
+            this._cssDarkFiles.forEach((el) => document.head.appendChild(el));
+        } else {
+            this._cssDarkFiles.forEach((el) => el.remove());
+            this._cssLightFiles.forEach((el) => document.head.appendChild(el));
+        }
        // this._metaTag.setAttribute("content", `${mode} ${opposite}`);
    };

--- a/ts/tsconfig.json
+++ b/ts/tsconfig.json
@@ -6,6 +6,7 @@
        "typeRoots": ["./typings", "../node_modules/@types"],
        "module": "esnext",
        "moduleResolution": "bundler",
-        "esModuleInterop": true
+        "esModuleInterop": true,
+        "skipLibCheck": true
    }
 }
--- a/ts/typings/d.ts
+++ b/ts/typings/d.ts
@@ -111,6 +111,7 @@ declare interface Modals {
    jellyseerrProfile?: Modal;
    profiles: Modal;
    addProfile: Modal;
+    editProfile: Modal;
    announce: Modal;
    editor: Modal;
    customizeEmails: Modal;