From c6de68c4c4bda3edcf6cf012bd98adea3baf866b Mon Sep 17 00:00:00 2001
From: ManeraKai <manerakai@protonmail.com>
Date: Thu, 25 Jul 2024 15:17:57 +0300
Subject: Migrating popup to svelte

---
 src/pages/options_src/App.svelte                   | 118 +++++++++++
 src/pages/options_src/General/Exceptions.svelte    | 108 ++++++++++
 src/pages/options_src/General/General.svelte       |  70 +++++++
 .../options_src/General/SettingsButtons.svelte     | 118 +++++++++++
 src/pages/options_src/Services/FrontendIcon.svelte |  43 ++++
 src/pages/options_src/Services/Instances.svelte    | 233 +++++++++++++++++++++
 src/pages/options_src/Services/RedirectType.svelte |  99 +++++++++
 src/pages/options_src/Services/ServiceIcon.svelte  |  40 ++++
 src/pages/options_src/Services/Services.svelte     | 188 +++++++++++++++++
 src/pages/options_src/Sidebar.svelte               |  43 ++++
 src/pages/options_src/main.js                      |   7 +
 src/pages/options_src/stores.js                    |   5 +
 12 files changed, 1072 insertions(+)
 create mode 100644 src/pages/options_src/App.svelte
 create mode 100644 src/pages/options_src/General/Exceptions.svelte
 create mode 100644 src/pages/options_src/General/General.svelte
 create mode 100644 src/pages/options_src/General/SettingsButtons.svelte
 create mode 100644 src/pages/options_src/Services/FrontendIcon.svelte
 create mode 100644 src/pages/options_src/Services/Instances.svelte
 create mode 100644 src/pages/options_src/Services/RedirectType.svelte
 create mode 100644 src/pages/options_src/Services/ServiceIcon.svelte
 create mode 100644 src/pages/options_src/Services/Services.svelte
 create mode 100644 src/pages/options_src/Sidebar.svelte
 create mode 100644 src/pages/options_src/main.js
 create mode 100644 src/pages/options_src/stores.js

(limited to 'src/pages/options_src')

diff --git a/src/pages/options_src/App.svelte b/src/pages/options_src/App.svelte
new file mode 100644
index 00000000..6bbacb9b
--- /dev/null
+++ b/src/pages/options_src/App.svelte
@@ -0,0 +1,118 @@
+<script>
+  let browser = window.browser || window.chrome
+
+  import General from "./General/General.svelte"
+  import utils from "../../assets/javascripts/utils.js"
+  import { onDestroy } from "svelte"
+  import servicesHelper from "../../assets/javascripts/services.js"
+  import { onMount } from "svelte"
+  import Sidebar from "./Sidebar.svelte"
+  import { options, config, page } from "./stores"
+  import Services from "./Services/Services.svelte"
+
+  let _options
+  const unsubscribeOptions = options.subscribe(val => {
+    if (val) {
+      _options = val
+      browser.storage.local.set({ options: val })
+    }
+  })
+
+  let _config
+  const unsubscribeConfig = config.subscribe(val => (_config = val))
+
+  onDestroy(() => {
+    unsubscribeOptions()
+    unsubscribeConfig()
+  })
+
+  onMount(async () => {
+    let opts = await utils.getOptions()
+    if (!opts) {
+      await servicesHelper.initDefaults()
+      opts = await utils.getOptions()
+    }
+    options.set(opts)
+    config.set(await utils.getConfig())
+  })
+
+  let _page
+  page.subscribe(val => (_page = val))
+
+  const dark = {
+    text: "#fff",
+    bgMain: "#121212",
+    bgSecondary: "#202020",
+    active: "#fbc117",
+    danger: "#f04141",
+    lightGrey: "#c3c3c3",
+  }
+  const light = {
+    text: "black",
+    bgMain: "white",
+    bgSecondary: "#e4e4e4",
+    active: "#fb9817",
+    danger: "#f04141",
+    lightGrey: "#c3c3c3",
+  }
+  let cssVariables
+  $: if (_options) {
+    if (_options.theme == "dark") {
+      cssVariables = dark
+    } else if (_options.theme == "light") {
+      cssVariables = light
+    } else if (window.matchMedia("(prefers-color-scheme: dark)").matches) {
+      cssVariables = dark
+    } else {
+      cssVariables = light
+    }
+  }
+</script>
+
+{#if _options && _config}
+  <div
+    class="main"
+    dir="auto"
+    style="
+    --text: {cssVariables.text};
+    --bg-main: {cssVariables.bgMain};
+    --bg-secondary: {cssVariables.bgSecondary};
+    --active: {cssVariables.active};
+    --danger: {cssVariables.danger};
+    --light-grey: {cssVariables.lightGrey};"
+  >
+    <Sidebar />
+    {#if _page == "general"}
+      <General />
+    {:else if _page == "services"}
+      <Services />
+    {/if}
+  </div>
+{:else}
+  <p>Loading...</p>
+{/if}
+
+<style>
+ 
+  :global(body) {
+    width: 100vw;
+    height: 100vh;
+    margin: 0;
+    padding: 0;
+  }
+
+  div {
+    height: 100%;
+    display: grid;
+    grid-template-columns: min-content 800px;
+    margin: 0;
+    padding-top: 50px;
+    justify-content: center;
+    font-family: "Inter";
+    box-sizing: border-box;
+    font-size: 16px;
+    background-color: var(--bg-main);
+    color: var(--text);
+    overflow: scroll;
+  }
+</style>
diff --git a/src/pages/options_src/General/Exceptions.svelte b/src/pages/options_src/General/Exceptions.svelte
new file mode 100644
index 00000000..4ef5591b
--- /dev/null
+++ b/src/pages/options_src/General/Exceptions.svelte
@@ -0,0 +1,108 @@
+<script>
+  import Row from "../../components/Row.svelte"
+  import Select from "../../components/Select.svelte"
+  import AddIcon from "../../icons/AddIcon.svelte"
+  import CloseIcon from "../../icons/CloseIcon.svelte"
+  import Input from "../../components/Input.svelte"
+  import Label from "../../components/Label.svelte"
+  import { options, config } from "../stores"
+  import { onDestroy } from "svelte"
+
+  let _options
+  let _config
+
+  const unsubscribeOptions = options.subscribe(val => (_options = val))
+  const unsubscribeConfig = config.subscribe(val => (_config = val))
+  onDestroy(() => {
+    unsubscribeOptions()
+    unsubscribeConfig()
+  })
+  let inputType = "url"
+  let inputValue = ""
+
+  $: inputPlaceholder = inputType == "url" ? "https://www.google.com" : "https?://(www.|)youtube.com/"
+
+  function removeException(exception) {
+    let index
+    index = _options.exceptions.url.indexOf(exception)
+    if (index > -1) {
+      _options.exceptions.url.splice(index, 1)
+    } else {
+      index = _options.exceptions.regex.indexOf(exception)
+      if (index > -1) _options.exceptions.regex.splice(index, 1)
+    }
+    options.set(_options)
+  }
+
+  function addException() {
+    let valid = false
+    if (inputType == "url" && /^(ftp|http|https):\/\/[^ "]+$/.test(inputValue)) {
+      valid = true
+      if (!_options.exceptions.url.includes(inputValue)) {
+        _options.exceptions.url.push(inputValue)
+      }
+    } else if (inputType == "regex") {
+      valid = true
+      if (!_options.exceptions.regex.includes(inputValue)) {
+        _options.exceptions.regex.push(inputValue)
+      }
+    }
+    if (valid) {
+      options.set(_options)
+      inputValue = ""
+    }
+  }
+</script>
+
+<div class="block block-option">
+  <Row>
+    <Label>Excluded from redirecting</Label>
+  </Row>
+  <Row>
+    <div>
+      <Input
+        placeholder={inputPlaceholder}
+        aria-label="Add url exception input"
+        bind:value={inputValue}
+        on:keydown={e => {
+          if (e.key === "Enter") addException()
+        }}
+      />
+      <Select
+        bind:value={inputType}
+        values={[
+          { value: "url", name: "URL" },
+          { value: "regex", name: "Regex" },
+        ]}
+      />
+    </div>
+    <button class="add" on:click={addException} aria-label="Add the url exception">
+      <AddIcon />
+    </button>
+  </Row>
+  <hr />
+  <div class="checklist">
+    {#each [..._options.exceptions.url, ..._options.exceptions.regex] as exception}
+      <Row>
+        {exception}
+        <button class="add" on:click={() => removeException(exception)}>
+          <CloseIcon />
+        </button>
+      </Row>
+      <hr />
+    {/each}
+  </div>
+</div>
+
+<style>
+  .add {
+    background-color: transparent;
+    border: none;
+    color: var(--text);
+    padding: 0;
+    margin: 0;
+    text-decoration: none;
+    display: inline-block;
+    cursor: pointer;
+  }
+</style>
diff --git a/src/pages/options_src/General/General.svelte b/src/pages/options_src/General/General.svelte
new file mode 100644
index 00000000..d5b2dd59
--- /dev/null
+++ b/src/pages/options_src/General/General.svelte
@@ -0,0 +1,70 @@
+<script>
+  let browser = window.browser || window.chrome
+
+  import Exceptions from "./Exceptions.svelte"
+  import SettingsButtons from "./SettingsButtons.svelte"
+  import RowSelect from "../../components/RowSelect.svelte"
+  import Checkbox from "../../components/RowCheckbox.svelte"
+  import { options } from "../stores"
+  import { onDestroy } from "svelte"
+
+  let _options
+  const unsubscribe = options.subscribe(val => (_options = val))
+  onDestroy(unsubscribe)
+
+  let bookmarksPermission
+  browser.permissions.contains({ permissions: ["bookmarks"] }, r => (bookmarksPermission = r))
+  $: if (bookmarksPermission) {
+    browser.permissions.request({ permissions: ["bookmarks"] }, r => (bookmarksPermission = r))
+  } else {
+    browser.permissions.remove({ permissions: ["bookmarks"] })
+    bookmarksPermission = false
+  }
+</script>
+
+<div>
+  <RowSelect
+    label="Theme"
+    values={[
+      { value: "detect", name: "Auto" },
+      { value: "light", name: "Light" },
+      { value: "dark", name: "Dark" },
+    ]}
+    value={_options.theme}
+    onChange={e => {
+      _options["theme"] = e.target.options[e.target.options.selectedIndex].value
+      options.set(_options)
+    }}
+    ariaLabel="select theme"
+  />
+
+  <RowSelect
+    label="Fetch public instances"
+    value={_options.fetchInstances}
+    onChange={e => {
+      _options["fetchInstances"] = e.target.options[e.target.options.selectedIndex].value
+      options.set(_options)
+    }}
+    ariaLabel="Select fetch public instances"
+    values={[
+      { value: "github", name: "GitHub" },
+      { value: "codeberg", name: "Codeberg" },
+      { value: "disable", name: "Disable" },
+    ]}
+  />
+
+  <Checkbox
+    label="Redirect Only in Incognito"
+    checked={_options.redirectOnlyInIncognito}
+    onChange={e => {
+      _options["redirectOnlyInIncognito"] = e.target.checked
+      options.set(_options)
+    }}
+  />
+
+  <Checkbox label="Bookmarks menu" bind:checked={bookmarksPermission} />
+
+  <Exceptions opts={_options} />
+
+  <SettingsButtons opts={_options} />
+</div>
diff --git a/src/pages/options_src/General/SettingsButtons.svelte b/src/pages/options_src/General/SettingsButtons.svelte
new file mode 100644
index 00000000..c37a3702
--- /dev/null
+++ b/src/pages/options_src/General/SettingsButtons.svelte
@@ -0,0 +1,118 @@
+<script>
+  let browser = window.browser || window.chrome
+
+  import { onDestroy } from "svelte"
+  import Button from "../../components/Button.svelte"
+  import ExportIcon from "../../icons/ExportIcon.svelte"
+  import ImportIcon from "../../icons/ImportIcon.svelte"
+  import ResetIcon from "../../icons/ResetIcon.svelte"
+  import { options } from "../stores"
+  import servicesHelper from "../../../assets/javascripts/services.js"
+  import utils from "../../../assets/javascripts/utils.js"
+
+  let _options
+  const unsubscribe = options.subscribe(val => (_options = val))
+  onDestroy(unsubscribe)
+
+  let disableButtons = false
+
+  let importSettingsInput
+  let importSettingsFiles
+  $: if (importSettingsFiles) {
+    disableButtons = true
+    const reader = new FileReader()
+    reader.readAsText(importSettingsFiles[0])
+    reader.onload = async () => {
+      const data = JSON.parse(reader.result)
+      if ("theme" in data && data.version == browser.runtime.getManifest().version) {
+        browser.storage.local.clear(async () => {
+          console.log("clearing")
+          options.set(data)
+          disableButtons = false
+        })
+      } else {
+        console.log("incompatible settings")
+        alert("Incompatible settings")
+      }
+    }
+    reader.onerror = error => {
+      console.log("error", error)
+      alert("Error!")
+    }
+  }
+
+  async function exportSettings() {
+    disableButtons = true
+    _options.version = browser.runtime.getManifest().version
+    const resultString = JSON.stringify(_options, null, "  ")
+    const anchor = document.createElement("a")
+    anchor.href = "data:application/json;base64," + btoa(resultString)
+    anchor.download = `libredirect-settings-v${_options.version}.json`
+    anchor.click()
+    disableButtons = false
+  }
+
+  async function exportSettingsSync() {
+    disableButtons = true
+    _options.version = browser.runtime.getManifest().version
+    await servicesHelper.initDefaults()
+    browser.storage.sync.set({ options: _options })
+    disableButtons = false
+  }
+
+  async function importSettingsSync() {
+    disableButtons = true
+    browser.storage.sync.get({ options }, r => {
+      const optionsSync = r.options
+      if (optionsSync.version == browser.runtime.getManifest().version) {
+        options.set(optionsSync)
+      } else {
+        alert("Error")
+      }
+      disableButtons = false
+    })
+  }
+
+  async function resetSettings() {
+    disableButtons = true
+    browser.storage.local.clear(async () => {
+      await servicesHelper.initDefaults()
+      options.set(await utils.getOptions())
+      disableButtons = false
+    })
+  }
+</script>
+
+<div class="buttons">
+  <Button on:click={() => importSettingsInput.click()} disabled={disableButtons}>
+    <ImportIcon />
+    <x data-localise="__MSG_importSettings__">Import Settings</x>
+  </Button>
+  <input
+    type="file"
+    accept=".json"
+    style="display: none"
+    bind:this={importSettingsInput}
+    bind:files={importSettingsFiles}
+  />
+
+  <Button on:click={exportSettings} disabled={disableButtons}>
+    <ExportIcon />
+    <x data-localise="__MSG_exportSettings__">Export Settings</x>
+  </Button>
+
+  <Button on:click={exportSettingsSync} disabled={disableButtons}>
+    <ExportIcon />
+    <x>Export Settings to Sync</x>
+  </Button>
+
+  <Button on:click={importSettingsSync} disabled={disableButtons}>
+    <ImportIcon />
+    <x>Import Settings from Sync</x>
+  </Button>
+
+  <Button on:click={resetSettings} disabled={disableButtons}>
+    <ResetIcon />
+    <x>Reset Settings</x>
+  </Button>
+</div>
diff --git a/src/pages/options_src/Services/FrontendIcon.svelte b/src/pages/options_src/Services/FrontendIcon.svelte
new file mode 100644
index 00000000..24942fd6
--- /dev/null
+++ b/src/pages/options_src/Services/FrontendIcon.svelte
@@ -0,0 +1,43 @@
+<script>
+  import { onDestroy } from "svelte"
+  export let details
+  import { config, options } from "../stores"
+  let _options
+  let _config
+
+  const unsubscribeOptions = options.subscribe(val => (_options = val))
+  const unsubscribeConfig = config.subscribe(val => (_config = val))
+  onDestroy(() => {
+    unsubscribeOptions()
+    unsubscribeConfig()
+  })
+
+  let theme
+  $: if (_options) {
+    if (_options.theme == "dark") {
+      theme = "dark"
+    } else if (_options.theme == "light") {
+      theme = "light"
+    } else if (window.matchMedia("(prefers-color-scheme: dark)").matches) {
+      theme = "dark"
+    } else {
+      theme = "light"
+    }
+  }
+
+  export let selectedService
+
+  $: imageType = _config.services[selectedService].frontends[details.value].imageType
+</script>
+
+{#if imageType}
+  {#if imageType == "svgMono"}
+    {#if theme == "dark"}
+      <img src={`/assets/images/${details.value}-icon-light.svg`} alt={details.label} />
+    {:else}
+      <img src={`/assets/images/${details.value}-icon.svg`} alt={details.label} />
+    {/if}
+  {:else}
+    <img src={`/assets/images/${details.value}-icon.${imageType}`} alt={details.label} />
+  {/if}
+{/if}
diff --git a/src/pages/options_src/Services/Instances.svelte b/src/pages/options_src/Services/Instances.svelte
new file mode 100644
index 00000000..892e395b
--- /dev/null
+++ b/src/pages/options_src/Services/Instances.svelte
@@ -0,0 +1,233 @@
+<script>
+  let browser = window.browser || window.chrome
+
+  import Button from "../../components/Button.svelte"
+  import AddIcon from "../../icons/AddIcon.svelte"
+  import { options, config } from "../stores"
+  import PingIcon from "../../icons/PingIcon.svelte"
+  import Row from "../../components/Row.svelte"
+  import Input from "../../components/Input.svelte"
+  import Label from "../../components/Label.svelte"
+  import CloseIcon from "../../icons/CloseIcon.svelte"
+  import { onDestroy, onMount } from "svelte"
+  import utils from "../../../assets/javascripts/utils"
+
+  export let selectedService
+  export let selectedFrontend
+
+  let _options
+  let _config
+
+  const unsubscribeOptions = options.subscribe(val => (_options = val))
+  const unsubscribeConfig = config.subscribe(val => (_config = val))
+  onDestroy(() => {
+    unsubscribeOptions()
+    unsubscribeConfig()
+  })
+
+  let blacklist
+  let redirects
+
+  $: serviceOptions = _options[selectedService]
+  $: serviceConf = _config.services[selectedService]
+
+  let allInstances = []
+
+  $: {
+    allInstances = []
+    if (_options[selectedFrontend]) allInstances.push(..._options[selectedFrontend])
+    if (redirects && redirects[selectedFrontend]) {
+      for (const network in redirects[selectedFrontend]) {
+        allInstances.push(...redirects[selectedFrontend][network])
+      }
+    }
+  }
+
+  let pingCache
+  $: {
+    if (pingCache) browser.storage.local.set({ pingCache })
+  }
+
+  function isCustomInstance(instance) {
+    if (redirects[selectedFrontend]) {
+      for (const network in redirects[selectedFrontend]) {
+        if (redirects[selectedFrontend][network].includes(instance)) return false
+      }
+    }
+    return true
+  }
+
+  async function pingInstances() {
+    pingCache = {}
+    for (const instance of allInstances) {
+      console.log("pinging...", instance)
+      pingCache[instance] = { color: "lightblue", value: "pinging..." }
+      const time = await utils.ping(instance)
+      pingCache[instance] = processTime(time)
+    }
+  }
+  function processTime(time) {
+    let value
+    let color
+    if (time < 5000) {
+      value = `${time}ms`
+      if (time <= 1000) color = "green"
+      else if (time <= 2000) color = "orange"
+    } else if (time >= 5000) {
+      color = "red"
+      if (time == 5000) value = "5000ms+"
+      if (time > 5000) value = `Error: ${time - 5000}`
+    } else {
+      color = "red"
+      value = "Server not found"
+    }
+    return { color, value }
+  }
+
+  onMount(async () => {
+    blacklist = await utils.getBlacklist(_options)
+    redirects = await utils.getList(_options)
+    pingCache = await utils.getPingCache()
+  })
+
+  let addInstanceValue
+  function addInstance() {
+    const instance = utils.protocolHost(new URL(addInstanceValue))
+    if (!_options[selectedFrontend].includes(instance)) {
+      _options[selectedFrontend].push(instance)
+      addInstanceValue = ""
+      options.set(_options)
+    }
+  }
+</script>
+
+{#if serviceConf.frontends[selectedFrontend].instanceList && redirects && blacklist}
+  <hr />
+  <div dir="ltr">
+    <div class="ping">
+      <Button on:click={pingInstances}>
+        <PingIcon />
+        Ping Instances
+      </Button>
+    </div>
+
+    <Row>
+      <Label>Add your favorite instances</Label>
+    </Row>
+
+    <Row>
+      <Input
+        bind:value={addInstanceValue}
+        type="url"
+        placeholder="https://instance.com"
+        aria-label="Add instance input"
+        on:keydown={e => e.key === "Enter" && addInstance()}
+      />
+      <button on:click={addInstance} class="add" aria-label="Add the instance">
+        <AddIcon />
+      </button>
+    </Row>
+
+    {#each _options[selectedFrontend] as instance}
+      <Row>
+        <span>
+          <a href={instance} target="_blank" rel="noopener noreferrer">{instance}</a>
+          {#if isCustomInstance(instance)}
+            <span style="color:grey">custom</span>
+          {/if}
+          {#if pingCache && pingCache[instance]}
+            <span style="color:{pingCache[instance].color}">{pingCache[instance].value}</span>
+          {/if}
+        </span>
+        <button
+          class="add"
+          aria-label="Remove Instance"
+          on:click={() => {
+            const index = _options[selectedFrontend].indexOf(instance)
+            if (index > -1) {
+              _options[selectedFrontend].splice(index, 1)
+              options.set(_options)
+            }
+          }}
+        >
+          <CloseIcon />
+        </button>
+      </Row>
+      <hr />
+    {/each}
+
+    {#if redirects !== "disabled" && blacklist !== "disabled"}
+      {#if redirects[selectedFrontend] && redirects[selectedFrontend]["clearnet"]}
+        {#each Object.entries(_config.networks) as [networkName, network]}
+          {#if redirects[selectedFrontend] && redirects[selectedFrontend][networkName] && redirects[selectedFrontend][networkName].length > 0}
+            <Row></Row>
+            <Row><Label>{network.name}</Label></Row>
+            <hr />
+            {#each redirects[selectedFrontend][networkName] as instance}
+              <Row>
+                <span>
+                  <a href={instance} target="_blank" rel="noopener noreferrer">{instance}</a>
+                  {#if blacklist.cloudflare.includes(instance)}
+                    <a
+                      href="https://libredirect.github.io/docs.html#instances"
+                      target="_blank"
+                      rel="noopener noreferrer"
+                      style="color:red;"
+                    >
+                      cloudflare
+                    </a>
+                  {/if}
+                  {#if _options[selectedFrontend].includes(instance)}
+                    <span style="color:grey">chosen</span>
+                  {/if}
+                  {#if pingCache && pingCache[instance]}
+                    <span style="color:{pingCache[instance].color}">{pingCache[instance].value}</span>
+                  {/if}
+                </span>
+                <button
+                  class="add"
+                  aria-label="Add instance"
+                  on:click={() => {
+                    if (_options[selectedFrontend]) {
+                      if (!_options[selectedFrontend].includes(instance)) {
+                        _options[selectedFrontend].push(instance)
+                        options.set(_options)
+                      }
+                    }
+                  }}
+                >
+                  <AddIcon />
+                </button>
+              </Row>
+              <hr />
+            {/each}
+          {/if}
+        {/each}
+      {:else}
+        <Row><Label>No instances found.</Label></Row>
+      {/if}
+    {/if}
+  </div>
+{/if}
+
+<style>
+  .add {
+    background-color: transparent;
+    border: none;
+    color: var(--text);
+    padding: 0;
+    margin: 0;
+    text-decoration: none;
+    display: inline-block;
+    cursor: pointer;
+  }
+
+  a {
+    color: var(--text);
+    text-decoration: none;
+  }
+
+  a:hover {
+    text-decoration: underline;
+  }
+</style>
diff --git a/src/pages/options_src/Services/RedirectType.svelte b/src/pages/options_src/Services/RedirectType.svelte
new file mode 100644
index 00000000..7f7a2843
--- /dev/null
+++ b/src/pages/options_src/Services/RedirectType.svelte
@@ -0,0 +1,99 @@
+<script>
+  import { onDestroy } from "svelte"
+
+  import RowSelect from "../../components/RowSelect.svelte"
+  import SvelteSelect from "svelte-select"
+  import { options, config } from "../stores"
+  import Row from "../../components/Row.svelte"
+  import Label from "../../components/Label.svelte"
+  import FrontendIcon from "./FrontendIcon.svelte"
+
+  let _options
+  let _config
+
+  const unsubscribeOptions = options.subscribe(val => (_options = val))
+  const unsubscribeConfig = config.subscribe(val => (_config = val))
+  onDestroy(() => {
+    unsubscribeOptions()
+    unsubscribeConfig()
+  })
+
+  export let selectedService
+
+  $: serviceConf = _config.services[selectedService]
+  $: serviceOptions = _options[selectedService]
+  $: frontendName = _options[selectedService].frontend
+
+  let values
+  $: if (serviceConf.frontends[frontendName].embeddable) {
+    values = [
+      { value: "both", name: "Both" },
+      { value: "sub_frame", name: "Only Embedded" },
+      { value: "main_frame", name: "Only Not Embedded" },
+    ]
+  } else if (
+    serviceConf.frontends[frontendName].desktopApp &&
+    Object.values(serviceConf.frontends).some(frontend => frontend.embeddable)
+  ) {
+    values = [
+      { value: "both", name: "both" },
+      { value: "main_frame", name: "Only Not Embedded" },
+    ]
+    if (serviceOptions.redirectType == "sub_frame") {
+      serviceOptions.redirectType = "main_frame"
+      options.set(_options)
+    }
+  } else {
+    values = [{ value: "main_frame", name: "Only Not Embedded" }]
+    serviceOptions.redirectType = "main_frame"
+    options.set(_options)
+  }
+
+  let embeddableFrontends = []
+  $: if (serviceConf) {
+    embeddableFrontends = []
+    for (const [frontendId, frontendConf] of Object.entries(serviceConf.frontends)) {
+      if (frontendConf.embeddable && frontendConf.instanceList) {
+        embeddableFrontends.push({
+          value: frontendId,
+          label: frontendConf.name,
+        })
+      }
+    }
+  }
+</script>
+
+<RowSelect
+  label="Redirect Type"
+  value={serviceOptions.redirectType}
+  onChange={e => {
+    serviceOptions.redirectType = e.target.options[e.target.options.selectedIndex].value
+    options.set(_options)
+  }}
+  {values}
+/>
+
+{#if serviceConf.frontends[frontendName].desktopApp && serviceOptions.redirectType != "main_frame"}
+  <Row>
+    <Label>Embed Frontend</Label>
+    <SvelteSelect
+      clearable={false}
+      class="svelte_select"
+      value={serviceOptions.embedFrontend}
+      on:change={e => {
+        serviceOptions.embedFrontend = e.detail.value
+        options.set(_options)
+      }}
+      items={embeddableFrontends}
+    >
+      <div class="slot" slot="item" let:item>
+        <FrontendIcon details={item} {selectedService} />
+        {item.label}
+      </div>
+      <div class="slot" slot="selection" let:selection>
+        <FrontendIcon details={selection} {selectedService} />
+        {selection.label}
+      </div>
+    </SvelteSelect>
+  </Row>
+{/if}
diff --git a/src/pages/options_src/Services/ServiceIcon.svelte b/src/pages/options_src/Services/ServiceIcon.svelte
new file mode 100644
index 00000000..89393cf6
--- /dev/null
+++ b/src/pages/options_src/Services/ServiceIcon.svelte
@@ -0,0 +1,40 @@
+<script>
+  import { onDestroy } from "svelte"
+  export let details
+  import { config, options } from "../stores"
+  let _options
+  let _config
+
+  const unsubscribeOptions = options.subscribe(val => (_options = val))
+  const unsubscribeConfig = config.subscribe(val => (_config = val))
+  onDestroy(() => {
+    unsubscribeOptions()
+    unsubscribeConfig()
+  })
+
+  let theme
+  $: if (_options) {
+    if (_options.theme == "dark") {
+      theme = "dark"
+    } else if (_options.theme == "light") {
+      theme = "light"
+    } else if (window.matchMedia("(prefers-color-scheme: dark)").matches) {
+      theme = "dark"
+    } else {
+      theme = "light"
+    }
+  }
+  $: imageType = _config.services[details.value].imageType
+</script>
+
+{#if imageType}
+  {#if imageType == "svgMono"}
+    {#if theme == "dark"}
+      <img src={`/assets/images/${details.value}-icon-light.svg`} alt={details.label} />
+    {:else}
+      <img src={`/assets/images/${details.value}-icon.svg`} alt={details.label} />
+    {/if}
+  {:else}
+    <img src={`/assets/images/${details.value}-icon.${imageType}`} alt={details.label} />
+  {/if}
+{/if}
diff --git a/src/pages/options_src/Services/Services.svelte b/src/pages/options_src/Services/Services.svelte
new file mode 100644
index 00000000..cb1efacb
--- /dev/null
+++ b/src/pages/options_src/Services/Services.svelte
@@ -0,0 +1,188 @@
+<script>
+  import Checkbox from "../../components/RowCheckbox.svelte"
+  import RowSelect from "../../components/RowSelect.svelte"
+  import Row from "../../components/Row.svelte"
+  import Label from "../../components/Label.svelte"
+  import Select from "../../components/Select.svelte"
+  import { options, config } from "../stores"
+  import RedirectType from "./RedirectType.svelte"
+  import { onDestroy } from "svelte"
+  import Instances from "./Instances.svelte"
+  import SvelteSelect from "svelte-select"
+  import ServiceIcon from "./ServiceIcon.svelte"
+  import FrontendIcon from "./FrontendIcon.svelte"
+
+  let _options
+  let _config
+
+  const unsubscribeOptions = options.subscribe(val => (_options = val))
+  const unsubscribeConfig = config.subscribe(val => (_config = val))
+  onDestroy(() => {
+    unsubscribeOptions()
+    unsubscribeConfig()
+  })
+
+  let selectedService = "youtube"
+  $: serviceConf = _config.services[selectedService]
+  $: serviceOptions = _options[selectedService]
+  $: frontendWebsite = serviceConf.frontends[serviceOptions.frontend].url
+</script>
+
+<div>
+  <Row>
+    <Label>
+      Service:
+      <a href={serviceConf.url} target="_blank" rel="noopener noreferrer">{serviceConf.url}</a>
+    </Label>
+    <SvelteSelect
+      clearable={false}
+      class="svelte_select"
+      value={selectedService}
+      on:change={e => (selectedService = e.detail.value)}
+      items={[
+        ...Object.entries(_config.services).map(([serviceKey, service]) => {
+          return { value: serviceKey, label: service.name }
+        }),
+      ]}
+    >
+      <div class="slot" slot="item" let:item>
+        <ServiceIcon details={item} />
+        {item.label}
+      </div>
+      <div class="slot" slot="selection" let:selection>
+        <ServiceIcon details={selection} />
+        {selection.label}
+      </div>
+    </SvelteSelect>
+  </Row>
+
+  <hr />
+
+  <Checkbox
+    label="Enable"
+    checked={serviceOptions.enabled}
+    onChange={e => {
+      serviceOptions.enabled = e.target.checked
+      options.set(_options)
+    }}
+  />
+
+  <div style={!serviceOptions.enabled && "pointer-events: none;opacity: 0.4;user-select: none;"}>
+    <Checkbox
+      label="Show in popup"
+      checked={_options.popupServices.includes(selectedService)}
+      onChange={e => {
+        if (e.target.checked && !_options.popupServices.includes(selectedService)) {
+          _options.popupServices.push(selectedService)
+        } else if (_options.popupServices.includes(selectedService)) {
+          const index = _options.popupServices.indexOf(selectedService)
+          if (index !== -1) _options.popupServices.splice(index, 1)
+        }
+        options.set(_options)
+      }}
+    />
+
+    <Row>
+      <Label>
+        Frontend:
+        <a href={frontendWebsite} target="_blank" rel="noopener noreferrer">
+          {frontendWebsite}
+        </a>
+      </Label>
+
+      <SvelteSelect
+        clearable={false}
+        class="svelte_select"
+        value={serviceOptions.frontend}
+        on:change={e => {
+          serviceOptions.frontend = e.detail.value
+          options.set(_options)
+        }}
+        items={[
+          ...Object.entries(serviceConf.frontends).map(([frontendId, frontend]) => ({
+            value: frontendId,
+            label: frontend.name,
+          })),
+        ]}
+      >
+        <div class="slot" slot="item" let:item>
+          <FrontendIcon details={item} {selectedService} />
+          {item.label}
+        </div>
+        <div class="slot" slot="selection" let:selection>
+          <FrontendIcon details={selection} {selectedService} />
+          {selection.label}
+        </div>
+      </SvelteSelect>
+    </Row>
+
+    <RedirectType {selectedService} />
+
+    <RowSelect
+      label="Unsupported embeds handling"
+      value={serviceOptions.unsupportedUrls}
+      onChange={e => {
+        serviceOptions.unsupportedUrls = e.target.options[e.target.options.selectedIndex].value
+        options.set(_options)
+      }}
+      values={[
+        { value: "bypass", name: "Bypass" },
+        { value: "block", name: "Block" },
+      ]}
+    />
+
+    {#if selectedService == "search"}
+      <Row>
+        <Label>
+          Set LibRedirect as Default Search Engine. For how to do in chromium browsers, click
+          <a
+            href="https://libredirect.github.io/docs.html#search_engine_chromium"
+            target="_blank"
+            rel="noopener noreferrer"
+            >here
+          </a>.
+        </Label>
+      </Row>
+    {/if}
+
+    <Instances
+      {selectedService}
+      selectedFrontend={!serviceConf.frontends[serviceOptions.frontend].desktopApp ||
+      serviceOptions.redirectType == "main_frame"
+        ? serviceOptions.frontend
+        : serviceOptions.embedFrontend}
+    />
+
+    <Row></Row>
+  </div>
+</div>
+
+<style>
+  :global(.svelte_select) {
+    font-weight: bold;
+    --item-padding: 0 10px;
+    --border: none;
+    --border-hover: none;
+    --width: 210px;
+    --background: var(--bg-secondary);
+    --list-background: var(--bg-secondary);
+    --item-active-background: red;
+    --item-is-active-bg: grey;
+    --item-hover-bg: grey;
+    --item-is-active-color: var(--text);
+    --padding: 0 0 0 10px;
+    --item-color: var(--text);
+  }
+  :global(.svelte_select .slot) {
+    display: flex;
+    justify-content: start;
+    align-items: center;
+  }
+
+  :global(.svelte_select img, .svelte_select svg) {
+    margin-right: 10px;
+    height: 26px;
+    width: 26px;
+    color: var(--text);
+  }
+</style>
diff --git a/src/pages/options_src/Sidebar.svelte b/src/pages/options_src/Sidebar.svelte
new file mode 100644
index 00000000..ff44995f
--- /dev/null
+++ b/src/pages/options_src/Sidebar.svelte
@@ -0,0 +1,43 @@
+<script>
+  import { page } from "./stores"
+  import GeneralIcon from "../icons/GeneralIcon.svelte"
+  import ServicesIcon from "../icons/ServicesIcon.svelte"
+  import AboutIcon from "../icons/AboutIcon.svelte"
+</script>
+
+<div>
+  <a href="#general" on:click={() => page.set("general")} style={$page == "general" && "color: var(--active);"}>
+    <GeneralIcon style="margin-right: 5px" />
+    <span data-localise="__MSG_general__">General</span>
+  </a>
+  <a href="#services" on:click={() => page.set("services")} style={$page == "services" && "color: var(--active);"}>
+    <ServicesIcon style="margin-right: 5px" />
+    <span data-localise="__MSG_services__">Services</span>
+  </a>
+  <a href="https://libredirect.github.io" target="_blank" rel="noopener noreferrer">
+    <AboutIcon style="margin-right: 5px" />
+    <span data-localise="__MSG_about__">About</span>
+  </a>
+</div>
+
+<style>
+  div {
+    display: flex;
+    flex-direction: column;
+    margin: 0 20px;
+  }
+
+  a {
+    display: flex;
+    align-items: center;
+    font-size: 18px;
+    text-decoration: none;
+    color: var(--text);
+    transition: 0.1s;
+    margin: 10px;
+  }
+
+  a:hover {
+    color: var(--active);
+  }
+</style>
diff --git a/src/pages/options_src/main.js b/src/pages/options_src/main.js
new file mode 100644
index 00000000..c4012f4a
--- /dev/null
+++ b/src/pages/options_src/main.js
@@ -0,0 +1,7 @@
+import App from "./App.svelte"
+
+const app = new App({
+  target: document.body,
+})
+
+export default app
diff --git a/src/pages/options_src/stores.js b/src/pages/options_src/stores.js
new file mode 100644
index 00000000..782f6064
--- /dev/null
+++ b/src/pages/options_src/stores.js
@@ -0,0 +1,5 @@
+import { writable } from "svelte/store"
+
+export const options = writable(null)
+export const config = writable(null)
+export const page = writable("general")
-- 
cgit 1.4.1


From 2cb60e91cd33ea63dc43b7afb2ce7a261bce6512 Mon Sep 17 00:00:00 2001
From: ManeraKai <manerakai@protonmail.com>
Date: Fri, 26 Jul 2024 17:39:22 +0300
Subject: Added mobile support in Svelte

---
 package.json                                       |   2 +-
 src/assets/javascripts/utils.js                    |   8 --
 src/pages/components/Input.svelte                  |   5 ++
 src/pages/components/RowCheckbox.svelte            |  14 ----
 src/pages/components/RowSelect.svelte              |  19 -----
 src/pages/fonts/Inter-VariableFont_slnt,wght.ttf   | Bin 0 -> 803384 bytes
 src/pages/fonts/Vazirmatn-VariableFont_wght.ttf    | Bin 0 -> 285620 bytes
 src/pages/fonts/styles.css                         |  13 +++
 src/pages/options/index.html                       |   1 +
 src/pages/options_src/App.svelte                   |  20 ++++-
 src/pages/options_src/General/General.svelte       |  89 ++++++++++++---------
 src/pages/options_src/Services/Instances.svelte    |   5 +-
 src/pages/options_src/Services/RedirectType.svelte |  23 +++---
 src/pages/options_src/Services/Services.svelte     |  71 ++++++++--------
 src/pages/options_src/Sidebar.svelte               |  14 ++++
 src/pages/popup/index.html                         |   2 +-
 .../stylesheets/Inter-VariableFont_slnt,wght.ttf   | Bin 803384 -> 0 bytes
 .../stylesheets/Vazirmatn-VariableFont_wght.ttf    | Bin 285620 -> 0 bytes
 src/pages/stylesheets/styles.css                   |  88 --------------------
 19 files changed, 157 insertions(+), 217 deletions(-)
 delete mode 100644 src/pages/components/RowCheckbox.svelte
 delete mode 100644 src/pages/components/RowSelect.svelte
 create mode 100644 src/pages/fonts/Inter-VariableFont_slnt,wght.ttf
 create mode 100644 src/pages/fonts/Vazirmatn-VariableFont_wght.ttf
 create mode 100644 src/pages/fonts/styles.css
 delete mode 100644 src/pages/stylesheets/Inter-VariableFont_slnt,wght.ttf
 delete mode 100644 src/pages/stylesheets/Vazirmatn-VariableFont_wght.ttf
 delete mode 100644 src/pages/stylesheets/styles.css

(limited to 'src/pages/options_src')

diff --git a/package.json b/package.json
index d0669a69..0f89cbdb 100644
--- a/package.json
+++ b/package.json
@@ -9,7 +9,7 @@
   "scripts": {
     "start": "web-ext run",
     "nightly": "web-ext run --firefox=/home/esmail/software/firefox_nightly/firefox",
-    "android": "web-ext run -t firefox-android --adb-device emulator-5554 --firefox-apk org.mozilla.fenix",
+    "android": "web-ext run -t firefox-android --adb-device emulator-5554 --firefox-apk org.mozilla.fenix ",
     "build": "web-ext build",
     "test": "web-ext lint",
     "html": "rollup -c --config-popup && rollup -c --config-options"
diff --git a/src/assets/javascripts/utils.js b/src/assets/javascripts/utils.js
index 439826dd..18168e90 100644
--- a/src/assets/javascripts/utils.js
+++ b/src/assets/javascripts/utils.js
@@ -20,13 +20,6 @@ function getNextInstance(currentInstanceUrl, instances) {
   return instances[nextInstanceIndex]
 }
 
-/**
- * @param {string} str
- */
-function camelCase(str) {
-  return str.charAt(0).toUpperCase() + str.slice(1)
-}
-
 /**
  * @param {URL} url
  */
@@ -178,7 +171,6 @@ export default {
   protocolHost,
   getList,
   getBlacklist,
-  camelCase,
   getConfig,
   getOptions,
   getPingCache,
diff --git a/src/pages/components/Input.svelte b/src/pages/components/Input.svelte
index d963233c..97a47e6d 100644
--- a/src/pages/components/Input.svelte
+++ b/src/pages/components/Input.svelte
@@ -38,4 +38,9 @@
   input:focus {
     outline-color: var(--active);
   }
+  @media (max-width: 715px) {
+    input {
+      width: 200px;
+    }
+  }
 </style>
diff --git a/src/pages/components/RowCheckbox.svelte b/src/pages/components/RowCheckbox.svelte
deleted file mode 100644
index b7ccab93..00000000
--- a/src/pages/components/RowCheckbox.svelte
+++ /dev/null
@@ -1,14 +0,0 @@
-<script>
-  import Row from "./Row.svelte"
-  import Checkbox from "./Checkbox.svelte"
-  import Label from "./Label.svelte"
-
-  export let label
-  export let checked
-  export let onChange
-</script>
-
-<Row>
-  <Label>{label}</Label>
-  <Checkbox bind:checked {onChange} />
-</Row>
diff --git a/src/pages/components/RowSelect.svelte b/src/pages/components/RowSelect.svelte
deleted file mode 100644
index d685803e..00000000
--- a/src/pages/components/RowSelect.svelte
+++ /dev/null
@@ -1,19 +0,0 @@
-<script>
-  import Row from "./Row.svelte"
-  import Select from "./Select.svelte"
-  import Label from "./Label.svelte"
-
-  export let label
-  export let values
-  export let value
-  export let onChange
-  export let ariaLabel
-</script>
-
-<Row>
-  <Label>{label}</Label>
-  <Select {value} {values} {onChange} {ariaLabel} />
-</Row>
-
-<style>
-</style>
diff --git a/src/pages/fonts/Inter-VariableFont_slnt,wght.ttf b/src/pages/fonts/Inter-VariableFont_slnt,wght.ttf
new file mode 100644
index 00000000..969a990f
Binary files /dev/null and b/src/pages/fonts/Inter-VariableFont_slnt,wght.ttf differ
diff --git a/src/pages/fonts/Vazirmatn-VariableFont_wght.ttf b/src/pages/fonts/Vazirmatn-VariableFont_wght.ttf
new file mode 100644
index 00000000..f4b97c01
Binary files /dev/null and b/src/pages/fonts/Vazirmatn-VariableFont_wght.ttf differ
diff --git a/src/pages/fonts/styles.css b/src/pages/fonts/styles.css
new file mode 100644
index 00000000..754543b1
--- /dev/null
+++ b/src/pages/fonts/styles.css
@@ -0,0 +1,13 @@
+@font-face {
+  font-family: "Inter";
+  src: url("Inter-VariableFont_slnt,wght.ttf");
+  font-weight: normal;
+  font-style: normal;
+}
+
+@font-face {
+  font-family: "Vazirmatn";
+  src: url("Vazirmatn-VariableFont_wght.ttf");
+  font-weight: normal;
+  font-style: normal;
+}
\ No newline at end of file
diff --git a/src/pages/options/index.html b/src/pages/options/index.html
index c3dcff71..b197d4a7 100644
--- a/src/pages/options/index.html
+++ b/src/pages/options/index.html
@@ -7,6 +7,7 @@
 	<link rel="icon" type="image/x-icon" href="../../../assets/images/libredirect.svg">
 	<title>Settings</title>
 	<link rel='stylesheet' href='build/bundle.css'>
+	<link rel='stylesheet' href='../fonts/styles.css'>
 	<script defer src='build/bundle.js'></script>
 </head>
 
diff --git a/src/pages/options_src/App.svelte b/src/pages/options_src/App.svelte
index 6bbacb9b..8b0d3c54 100644
--- a/src/pages/options_src/App.svelte
+++ b/src/pages/options_src/App.svelte
@@ -93,7 +93,6 @@
 {/if}
 
 <style>
- 
   :global(body) {
     width: 100vw;
     height: 100vh;
@@ -115,4 +114,23 @@
     color: var(--text);
     overflow: scroll;
   }
+
+  @media (max-width: 1250px) {
+    div {
+      grid-template-columns: auto;
+      grid-template-rows: min-content auto;
+      padding-left: 5vw;
+      padding-right: 5vw;
+    }
+  }
+
+  @media (max-width: 715px) {
+    div {
+      font-size: 14px;
+      grid-template-columns: auto;
+      grid-template-rows: min-content auto;
+      padding-left: 5vw;
+      padding-right: 5vw;
+    }
+  }
 </style>
diff --git a/src/pages/options_src/General/General.svelte b/src/pages/options_src/General/General.svelte
index d5b2dd59..2cf65285 100644
--- a/src/pages/options_src/General/General.svelte
+++ b/src/pages/options_src/General/General.svelte
@@ -3,10 +3,12 @@
 
   import Exceptions from "./Exceptions.svelte"
   import SettingsButtons from "./SettingsButtons.svelte"
-  import RowSelect from "../../components/RowSelect.svelte"
-  import Checkbox from "../../components/RowCheckbox.svelte"
   import { options } from "../stores"
   import { onDestroy } from "svelte"
+  import Row from "../../components/Row.svelte"
+  import Label from "../../components/Label.svelte"
+  import Select from "../../components/Select.svelte"
+  import Checkbox from "../../components/Checkbox.svelte"
 
   let _options
   const unsubscribe = options.subscribe(val => (_options = val))
@@ -23,46 +25,55 @@
 </script>
 
 <div>
-  <RowSelect
-    label="Theme"
-    values={[
-      { value: "detect", name: "Auto" },
-      { value: "light", name: "Light" },
-      { value: "dark", name: "Dark" },
-    ]}
-    value={_options.theme}
-    onChange={e => {
-      _options["theme"] = e.target.options[e.target.options.selectedIndex].value
-      options.set(_options)
-    }}
-    ariaLabel="select theme"
-  />
+  <Row>
+    <Label>Theme</Label>
+    <Select
+      values={[
+        { value: "detect", name: "Auto" },
+        { value: "light", name: "Light" },
+        { value: "dark", name: "Dark" },
+      ]}
+      value={_options.theme}
+      onChange={e => {
+        _options.theme = e.target.options[e.target.options.selectedIndex].value
+        options.set(_options)
+      }}
+      ariaLabel="select theme"
+    />
+  </Row>
 
-  <RowSelect
-    label="Fetch public instances"
-    value={_options.fetchInstances}
-    onChange={e => {
-      _options["fetchInstances"] = e.target.options[e.target.options.selectedIndex].value
-      options.set(_options)
-    }}
-    ariaLabel="Select fetch public instances"
-    values={[
-      { value: "github", name: "GitHub" },
-      { value: "codeberg", name: "Codeberg" },
-      { value: "disable", name: "Disable" },
-    ]}
-  />
+  <Row>
+    <Label>Fetch public instances</Label>
+    <Select
+      value={_options.fetchInstances}
+      values={[
+        { value: "github", name: "GitHub" },
+        { value: "codeberg", name: "Codeberg" },
+        { value: "disable", name: "Disable" },
+      ]}
+      onChange={e => {
+        _options.fetchInstances = e.target.options[e.target.options.selectedIndex].value
+        options.set(_options)
+      }}
+      ariaLabel={"Select fetch public instances"}
+    />
+  </Row>
 
-  <Checkbox
-    label="Redirect Only in Incognito"
-    checked={_options.redirectOnlyInIncognito}
-    onChange={e => {
-      _options["redirectOnlyInIncognito"] = e.target.checked
-      options.set(_options)
-    }}
-  />
+  <Row>
+    <Label>Redirect Only in Incognito</Label>
+    <Checkbox
+      checked={_options.redirectOnlyInIncognito}
+      onChange={e => {
+        _options.redirectOnlyInIncognito = e.target.checked
+        options.set(_options)
+      }}
+    />
+  </Row>
 
-  <Checkbox label="Bookmarks menu" bind:checked={bookmarksPermission} />
+  <Row>
+    <Label>Bookmarks menu</Label>
+    <Checkbox bind:checked={bookmarksPermission} />
+  </Row>
 
   <Exceptions opts={_options} />
 
diff --git a/src/pages/options_src/Services/Instances.svelte b/src/pages/options_src/Services/Instances.svelte
index 892e395b..e62d410d 100644
--- a/src/pages/options_src/Services/Instances.svelte
+++ b/src/pages/options_src/Services/Instances.svelte
@@ -63,10 +63,10 @@
       console.log("pinging...", instance)
       pingCache[instance] = { color: "lightblue", value: "pinging..." }
       const time = await utils.ping(instance)
-      pingCache[instance] = processTime(time)
+      pingCache[instance] = colorTime(time)
     }
   }
-  function processTime(time) {
+  function colorTime(time) {
     let value
     let color
     if (time < 5000) {
@@ -225,6 +225,7 @@
   a {
     color: var(--text);
     text-decoration: none;
+    word-wrap: anywhere;
   }
 
   a:hover {
diff --git a/src/pages/options_src/Services/RedirectType.svelte b/src/pages/options_src/Services/RedirectType.svelte
index 7f7a2843..11044080 100644
--- a/src/pages/options_src/Services/RedirectType.svelte
+++ b/src/pages/options_src/Services/RedirectType.svelte
@@ -1,12 +1,11 @@
 <script>
   import { onDestroy } from "svelte"
-
-  import RowSelect from "../../components/RowSelect.svelte"
   import SvelteSelect from "svelte-select"
   import { options, config } from "../stores"
   import Row from "../../components/Row.svelte"
   import Label from "../../components/Label.svelte"
   import FrontendIcon from "./FrontendIcon.svelte"
+  import Select from "../../components/Select.svelte"
 
   let _options
   let _config
@@ -63,15 +62,17 @@
   }
 </script>
 
-<RowSelect
-  label="Redirect Type"
-  value={serviceOptions.redirectType}
-  onChange={e => {
-    serviceOptions.redirectType = e.target.options[e.target.options.selectedIndex].value
-    options.set(_options)
-  }}
-  {values}
-/>
+<Row>
+  <Label>Redirect Type</Label>
+  <Select
+    value={serviceOptions.redirectType}
+    onChange={e => {
+      serviceOptions.redirectType = e.target.options[e.target.options.selectedIndex].value
+      options.set(_options)
+    }}
+    {values}
+  />
+</Row>
 
 {#if serviceConf.frontends[frontendName].desktopApp && serviceOptions.redirectType != "main_frame"}
   <Row>
diff --git a/src/pages/options_src/Services/Services.svelte b/src/pages/options_src/Services/Services.svelte
index cb1efacb..9c4e6c97 100644
--- a/src/pages/options_src/Services/Services.svelte
+++ b/src/pages/options_src/Services/Services.svelte
@@ -1,6 +1,4 @@
 <script>
-  import Checkbox from "../../components/RowCheckbox.svelte"
-  import RowSelect from "../../components/RowSelect.svelte"
   import Row from "../../components/Row.svelte"
   import Label from "../../components/Label.svelte"
   import Select from "../../components/Select.svelte"
@@ -11,6 +9,7 @@
   import SvelteSelect from "svelte-select"
   import ServiceIcon from "./ServiceIcon.svelte"
   import FrontendIcon from "./FrontendIcon.svelte"
+  import Checkbox from "../../components/Checkbox.svelte"
 
   let _options
   let _config
@@ -58,29 +57,33 @@
 
   <hr />
 
-  <Checkbox
-    label="Enable"
-    checked={serviceOptions.enabled}
-    onChange={e => {
-      serviceOptions.enabled = e.target.checked
-      options.set(_options)
-    }}
-  />
-
-  <div style={!serviceOptions.enabled && "pointer-events: none;opacity: 0.4;user-select: none;"}>
+  <Row>
+    <Label>Enable</Label>
     <Checkbox
-      label="Show in popup"
-      checked={_options.popupServices.includes(selectedService)}
+      checked={serviceOptions.enabled}
       onChange={e => {
-        if (e.target.checked && !_options.popupServices.includes(selectedService)) {
-          _options.popupServices.push(selectedService)
-        } else if (_options.popupServices.includes(selectedService)) {
-          const index = _options.popupServices.indexOf(selectedService)
-          if (index !== -1) _options.popupServices.splice(index, 1)
-        }
+        serviceOptions.enabled = e.target.checked
         options.set(_options)
       }}
     />
+  </Row>
+
+  <div style={!serviceOptions.enabled && "pointer-events: none;opacity: 0.4;user-select: none;"}>
+    <Row>
+      <Label>Show in popup</Label>
+      <Checkbox
+        checked={_options.popupServices.includes(selectedService)}
+        onChange={e => {
+          if (e.target.checked && !_options.popupServices.includes(selectedService)) {
+            _options.popupServices.push(selectedService)
+          } else if (_options.popupServices.includes(selectedService)) {
+            const index = _options.popupServices.indexOf(selectedService)
+            if (index !== -1) _options.popupServices.splice(index, 1)
+          }
+          options.set(_options)
+        }}
+      />
+    </Row>
 
     <Row>
       <Label>
@@ -118,18 +121,20 @@
 
     <RedirectType {selectedService} />
 
-    <RowSelect
-      label="Unsupported embeds handling"
-      value={serviceOptions.unsupportedUrls}
-      onChange={e => {
-        serviceOptions.unsupportedUrls = e.target.options[e.target.options.selectedIndex].value
-        options.set(_options)
-      }}
-      values={[
-        { value: "bypass", name: "Bypass" },
-        { value: "block", name: "Block" },
-      ]}
-    />
+    <Row>
+      <Label>Unsupported embeds handling</Label>
+      <Select
+        value={serviceOptions.unsupportedUrls}
+        onChange={e => {
+          serviceOptions.unsupportedUrls = e.target.options[e.target.options.selectedIndex].value
+          options.set(_options)
+        }}
+        values={[
+          { value: "bypass", name: "Bypass" },
+          { value: "block", name: "Block" },
+        ]}
+      />
+    </Row>
 
     {#if selectedService == "search"}
       <Row>
@@ -163,6 +168,7 @@
     --item-padding: 0 10px;
     --border: none;
     --border-hover: none;
+    --border-focused: none;
     --width: 210px;
     --background: var(--bg-secondary);
     --list-background: var(--bg-secondary);
@@ -178,7 +184,6 @@
     justify-content: start;
     align-items: center;
   }
-
   :global(.svelte_select img, .svelte_select svg) {
     margin-right: 10px;
     height: 26px;
diff --git a/src/pages/options_src/Sidebar.svelte b/src/pages/options_src/Sidebar.svelte
index ff44995f..4a808268 100644
--- a/src/pages/options_src/Sidebar.svelte
+++ b/src/pages/options_src/Sidebar.svelte
@@ -40,4 +40,18 @@
   a:hover {
     color: var(--active);
   }
+
+  @media (max-width: 1250px) {
+    div {
+      flex-direction: row;
+      justify-content: center;
+      margin: 0;
+    }
+  }
+
+  @media (max-width: 715px) {
+    a {
+      margin: 5px;
+    }
+  }
 </style>
diff --git a/src/pages/popup/index.html b/src/pages/popup/index.html
index 5c589bf7..b197d4a7 100644
--- a/src/pages/popup/index.html
+++ b/src/pages/popup/index.html
@@ -7,7 +7,7 @@
 	<link rel="icon" type="image/x-icon" href="../../../assets/images/libredirect.svg">
 	<title>Settings</title>
 	<link rel='stylesheet' href='build/bundle.css'>
-	<link rel='stylesheet' href='../stylesheets/styles.css'>
+	<link rel='stylesheet' href='../fonts/styles.css'>
 	<script defer src='build/bundle.js'></script>
 </head>
 
diff --git a/src/pages/stylesheets/Inter-VariableFont_slnt,wght.ttf b/src/pages/stylesheets/Inter-VariableFont_slnt,wght.ttf
deleted file mode 100644
index 969a990f..00000000
Binary files a/src/pages/stylesheets/Inter-VariableFont_slnt,wght.ttf and /dev/null differ
diff --git a/src/pages/stylesheets/Vazirmatn-VariableFont_wght.ttf b/src/pages/stylesheets/Vazirmatn-VariableFont_wght.ttf
deleted file mode 100644
index f4b97c01..00000000
Binary files a/src/pages/stylesheets/Vazirmatn-VariableFont_wght.ttf and /dev/null differ
diff --git a/src/pages/stylesheets/styles.css b/src/pages/stylesheets/styles.css
deleted file mode 100644
index 9e8fedb3..00000000
--- a/src/pages/stylesheets/styles.css
+++ /dev/null
@@ -1,88 +0,0 @@
-@font-face {
-  font-family: "Inter";
-  src: url("Inter-VariableFont_slnt,wght.ttf");
-  font-weight: normal;
-  font-style: normal;
-}
-
-@font-face {
-  font-family: "Vazirmatn";
-  src: url("Vazirmatn-VariableFont_wght.ttf");
-  font-weight: normal;
-  font-style: normal;
-}
-
-/* 
-
-@media (max-width: 1250px) {
-  body.option {
-    flex-direction: column;
-    width: 95vw;
-    align-items: center;
-    padding: 40px 0px;
-  }
-
-  section.links {
-    flex-direction: row;
-    width: 95vw;
-    padding: 0 55px;
-  }
-
-  section.block-option {
-    width: 95vw;
-  }
-
-  div.checklist div x {
-    overflow: hidden;
-  }
-}
-
-html.mobile img,
-html.mobile svg {
-  margin-right: 10px;
-  height: 30px;
-  width: 30px;
-  color: var(--text);
-}
-
-html.mobile div.block {
-  padding: 0 15px;
-  justify-content: space-between;
-  display: flex;
-  align-items: center;
-  margin-top: 20px;
-  margin-bottom: 20px;
-}
-
-html.mobile div.block input[type="checkbox"] {
-  width: 58px;
-  height: 30px;
-}
-
-html.mobile div.block input[type="checkbox"]::before {
-  width: 24px;
-  height: 24px;
-  top: 3px;
-  left: 3.5px;
-}
-
-html.mobile div.block input[type="checkbox"]:checked::before {
-  left: 30px;
-}
-
-html.mobile body.option {
-  flex-direction: column;
-  width: 100%;
-  padding: 0;
-  align-items: center;
-}
-
-html.mobile section.links {
-  flex-direction: row;
-  width: 100%;
-  padding: 0 55px;
-}
-
-html.mobile section.block-option {
-  width: 100%;
-} */
\ No newline at end of file
-- 
cgit 1.4.1


From e97b618660094491013d9d4999ac4802429f3dc7 Mon Sep 17 00:00:00 2001
From: ManeraKai <manerakai@protonmail.com>
Date: Fri, 26 Jul 2024 23:53:31 +0300
Subject: Added translation support to Svelte

---
 package.json                                       |   1 +
 src/assets/javascripts/localise.js                 |  34 ------
 src/pages/components/Checkbox.svelte               |  19 ++--
 src/pages/icons/ExportIcon.svelte                  |   9 +-
 src/pages/icons/ImportIcon.svelte                  |  17 ++-
 src/pages/icons/PingIcon.svelte                    |   9 +-
 src/pages/icons/ResetIcon.svelte                   |   1 +
 src/pages/options/init.js                          |   8 --
 src/pages/options_src/App.svelte                   |   9 +-
 src/pages/options_src/General/Exceptions.svelte    |  10 +-
 src/pages/options_src/General/General.svelte       |  18 ++--
 .../options_src/General/SettingsButtons.svelte     |  31 ++++--
 src/pages/options_src/Services/Instances.svelte    |  32 +++---
 src/pages/options_src/Services/RedirectType.svelte |  12 ++-
 src/pages/options_src/Services/Services.svelte     | 115 +++++++++++----------
 src/pages/options_src/Sidebar.svelte               |  23 +++--
 src/pages/popup_src/App.svelte                     |   2 +-
 src/pages/popup_src/Buttons.svelte                 |  94 +++++++++--------
 src/pages/popup_src/components/Switch.svelte       |  13 ++-
 19 files changed, 251 insertions(+), 206 deletions(-)
 delete mode 100644 src/assets/javascripts/localise.js
 delete mode 100644 src/pages/options/init.js

(limited to 'src/pages/options_src')

diff --git a/package.json b/package.json
index 0f89cbdb..2a79b660 100644
--- a/package.json
+++ b/package.json
@@ -9,6 +9,7 @@
   "scripts": {
     "start": "web-ext run",
     "nightly": "web-ext run --firefox=/home/esmail/software/firefox_nightly/firefox",
+    "start_ar": "web-ext run --firefox=/home/esmail/software/firefox_ar/firefox",
     "android": "web-ext run -t firefox-android --adb-device emulator-5554 --firefox-apk org.mozilla.fenix ",
     "build": "web-ext build",
     "test": "web-ext lint",
diff --git a/src/assets/javascripts/localise.js b/src/assets/javascripts/localise.js
deleted file mode 100644
index d26d07d4..00000000
--- a/src/assets/javascripts/localise.js
+++ /dev/null
@@ -1,34 +0,0 @@
-window.browser = window.browser || window.chrome
-
-function localisePage() {
-  /**
-   * @param {string} tag
-   */
-  function getMessage(tag) {
-    return tag.replace(/__MSG_(\w+)__/g, (_match, v1) => {
-      return v1 ? browser.i18n.getMessage(v1) : null
-    })
-  }
-
-  const elements = document.querySelectorAll("[data-localise]")
-  for (let i in elements)
-    if (elements.hasOwnProperty(i)) {
-      const obj = elements[i]
-      const tag = obj.getAttribute("data-localise").toString()
-      const msg = getMessage(tag)
-      if (msg && msg !== tag) obj.textContent = msg
-    }
-
-  const placeholders = document.querySelectorAll("[data-localise-placeholder]")
-  for (let i in placeholders)
-    if (placeholders.hasOwnProperty(i)) {
-      const obj = placeholders[i]
-      const tag = obj.getAttribute("data-localise-placeholder").toString()
-      const msg = getMessage(tag)
-      if (msg && msg !== tag) obj.placeholder = msg
-    }
-}
-
-export default {
-  localisePage,
-}
diff --git a/src/pages/components/Checkbox.svelte b/src/pages/components/Checkbox.svelte
index dbefd7e9..9ba9c56c 100644
--- a/src/pages/components/Checkbox.svelte
+++ b/src/pages/components/Checkbox.svelte
@@ -1,9 +1,10 @@
 <script>
   export let checked
   export let onChange
+  console.log(document.body.dir)
 </script>
 
-<input {...$$restProps} bind:checked on:change={onChange} type="checkbox" />
+<input class={document.body.dir} {...$$restProps} bind:checked on:change={onChange} type="checkbox" />
 
 <style>
   input[type="checkbox"] {
@@ -40,13 +41,13 @@
     left: 24px;
   }
 
-  /* body.rtl div.block input[type="checkbox"]::before {
-      left: auto;
-      right: 4px;
-    } */
+  input[type="checkbox"].rtl::before {
+    left: auto;
+    right: 3.5px;
+  }
 
-  /* body.rtl div.block input[type="checkbox"]:checked::before {
-      left: auto;
-      right: 24px;
-    } */
+  input[type="checkbox"].rtl:checked::before {
+    left: auto;
+    right: 24px;
+  }
 </style>
diff --git a/src/pages/icons/ExportIcon.svelte b/src/pages/icons/ExportIcon.svelte
index 196726a8..d155e5c5 100644
--- a/src/pages/icons/ExportIcon.svelte
+++ b/src/pages/icons/ExportIcon.svelte
@@ -1,4 +1,11 @@
-<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="currentColor">
+<svg
+  {...$$restProps}
+  xmlns="http://www.w3.org/2000/svg"
+  height="24px"
+  viewBox="0 0 24 24"
+  width="24px"
+  fill="currentColor"
+>
   <path
     d="M10.09 15.59L11.5 17l5-5-5-5-1.41 1.41L12.67 11H3v2h9.67l-2.58 2.59zM19 3H5c-1.11 0-2 .9-2 2v4h2V5h14v14H5v-4H3v4c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2z"
   />
diff --git a/src/pages/icons/ImportIcon.svelte b/src/pages/icons/ImportIcon.svelte
index f022b4f0..f64d0ff6 100644
--- a/src/pages/icons/ImportIcon.svelte
+++ b/src/pages/icons/ImportIcon.svelte
@@ -1,5 +1,12 @@
-<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="currentColor">
-    <path
-      d="M19 19H5V5h7V3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2v-7h-2v7zM14 3v2h3.59l-9.83 9.83 1.41 1.41L19 6.41V10h2V3h-7z"
-    />
-  </svg>
\ No newline at end of file
+<svg
+  {...$$restProps}
+  xmlns="http://www.w3.org/2000/svg"
+  height="24px"
+  viewBox="0 0 24 24"
+  width="24px"
+  fill="currentColor"
+>
+  <path
+    d="M19 19H5V5h7V3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2v-7h-2v7zM14 3v2h3.59l-9.83 9.83 1.41 1.41L19 6.41V10h2V3h-7z"
+  />
+</svg>
diff --git a/src/pages/icons/PingIcon.svelte b/src/pages/icons/PingIcon.svelte
index 8fcfe27b..34c4a37d 100644
--- a/src/pages/icons/PingIcon.svelte
+++ b/src/pages/icons/PingIcon.svelte
@@ -1,4 +1,11 @@
-<svg xmlns="http://www.w3.org/2000/svg" height="20px" viewBox="0 0 24 24" width="20px" fill="currentColor">
+<svg
+  {...$$restProps}
+  xmlns="http://www.w3.org/2000/svg"
+  height="20px"
+  viewBox="0 0 24 24"
+  width="20px"
+  fill="currentColor"
+>
   <path
     d="M10.45 15.5q.6.6 1.55.587.95-.012 1.4-.687L19 7l-8.4 5.6q-.675.45-.712 1.375-.038.925.562 1.525ZM12 4q1.475 0 2.838.412Q16.2 4.825 17.4 5.65l-1.9 1.2q-.825-.425-1.712-.637Q12.9 6 12 6 8.675 6 6.338 8.337 4 10.675 4 14q0 1.05.287 2.075Q4.575 17.1 5.1 18h13.8q.575-.95.838-1.975Q20 15 20 13.9q0-.9-.212-1.75-.213-.85-.638-1.65l1.2-1.9q.75 1.175 1.188 2.5.437 1.325.462 2.75.025 1.425-.325 2.725-.35 1.3-1.025 2.475-.275.45-.75.7-.475.25-1 .25H5.1q-.525 0-1-.25t-.75-.7q-.65-1.125-1-2.387Q2 15.4 2 14q0-2.075.788-3.888.787-1.812 2.15-3.175Q6.3 5.575 8.125 4.787 9.95 4 12 4Zm.175 7.825Z"
   /></svg
diff --git a/src/pages/icons/ResetIcon.svelte b/src/pages/icons/ResetIcon.svelte
index 0900aef8..6daf57e6 100644
--- a/src/pages/icons/ResetIcon.svelte
+++ b/src/pages/icons/ResetIcon.svelte
@@ -5,6 +5,7 @@
   viewBox="0 0 24 24"
   width="24px"
   fill="currentColor"
+  {...$$restProps}
 >
   <path
     d="M12,5V2L8,6l4,4V7c3.31,0,6,2.69,6,6c0,2.97-2.17,5.43-5,5.91v2.02c3.95-0.49,7-3.85,7-7.93C20,8.58,16.42,5,12,5z"
diff --git a/src/pages/options/init.js b/src/pages/options/init.js
deleted file mode 100644
index 5a7ffb6e..00000000
--- a/src/pages/options/init.js
+++ /dev/null
@@ -1,8 +0,0 @@
-window.browser = window.browser || window.chrome
-import localise from "../../assets/javascripts/localise.js"
-
-if (["ar", "iw", "ku", "fa", "ur"].includes(browser.i18n.getUILanguage())) {
-  document.getElementsByTagName("body")[0].classList.add("rtl")
-  document.getElementsByTagName("body")[0].dir = "rtl"
-}
-localise.localisePage()
\ No newline at end of file
diff --git a/src/pages/options_src/App.svelte b/src/pages/options_src/App.svelte
index 8b0d3c54..dfafe1f0 100644
--- a/src/pages/options_src/App.svelte
+++ b/src/pages/options_src/App.svelte
@@ -1,5 +1,5 @@
 <script>
-  let browser = window.browser || window.chrome
+  const browser = window.browser || window.chrome
 
   import General from "./General/General.svelte"
   import utils from "../../assets/javascripts/utils.js"
@@ -67,12 +67,15 @@
       cssVariables = light
     }
   }
+
+  const dir = ["ar", "iw", "ku", "fa", "ur"].includes(browser.i18n.getUILanguage()) ? "rtl" : "ltr"
+  document.body.dir = dir
 </script>
 
 {#if _options && _config}
   <div
-    class="main"
-    dir="auto"
+    class={dir}
+    {dir}
     style="
     --text: {cssVariables.text};
     --bg-main: {cssVariables.bgMain};
diff --git a/src/pages/options_src/General/Exceptions.svelte b/src/pages/options_src/General/Exceptions.svelte
index 4ef5591b..7315877d 100644
--- a/src/pages/options_src/General/Exceptions.svelte
+++ b/src/pages/options_src/General/Exceptions.svelte
@@ -1,4 +1,6 @@
 <script>
+  const browser = window.browser || window.chrome
+
   import Row from "../../components/Row.svelte"
   import Select from "../../components/Select.svelte"
   import AddIcon from "../../icons/AddIcon.svelte"
@@ -54,10 +56,10 @@
   }
 </script>
 
-<div class="block block-option">
-  <Row>
-    <Label>Excluded from redirecting</Label>
-  </Row>
+<Row>
+  <Label>{browser.i18n.getMessage("excludeFromRedirecting") || "Excluded from redirecting"}</Label>
+</Row>
+<div dir="ltr">
   <Row>
     <div>
       <Input
diff --git a/src/pages/options_src/General/General.svelte b/src/pages/options_src/General/General.svelte
index 2cf65285..732ad83b 100644
--- a/src/pages/options_src/General/General.svelte
+++ b/src/pages/options_src/General/General.svelte
@@ -1,5 +1,5 @@
 <script>
-  let browser = window.browser || window.chrome
+  const browser = window.browser || window.chrome
 
   import Exceptions from "./Exceptions.svelte"
   import SettingsButtons from "./SettingsButtons.svelte"
@@ -26,12 +26,12 @@
 
 <div>
   <Row>
-    <Label>Theme</Label>
+    <Label>{browser.i18n.getMessage("theme") || "Theme"}</Label>
     <Select
       values={[
-        { value: "detect", name: "Auto" },
-        { value: "light", name: "Light" },
-        { value: "dark", name: "Dark" },
+        { value: "detect", name: browser.i18n.getMessage("auto") || "Auto" },
+        { value: "light", name: browser.i18n.getMessage("light") || "Light" },
+        { value: "dark", name: browser.i18n.getMessage("dark") || "Dark" },
       ]}
       value={_options.theme}
       onChange={e => {
@@ -43,13 +43,13 @@
   </Row>
 
   <Row>
-    <Label>Fetch public instances</Label>
+    <Label>{browser.i18n.getMessage("fetchPublicInstances") || "Fetch public instances"}</Label>
     <Select
       value={_options.fetchInstances}
       values={[
         { value: "github", name: "GitHub" },
         { value: "codeberg", name: "Codeberg" },
-        { value: "disable", name: "Disable" },
+        { value: "disable", name: browser.i18n.getMessage("disable") || "Disable" },
       ]}
       onChange={e => {
         _options.fetchInstances = e.target.options[e.target.options.selectedIndex].value
@@ -60,7 +60,7 @@
   </Row>
 
   <Row>
-    <Label>Redirect Only in Incognito</Label>
+    <Label>{browser.i18n.getMessage("redirectOnlyInIncognito") || "Redirect Only in Incognito"}</Label>
     <Checkbox
       checked={_options.redirectOnlyInIncognito}
       onChange={e => {
@@ -71,7 +71,7 @@
   </Row>
 
   <Row>
-    <Label>Bookmarks menu</Label>
+    <Label>{browser.i18n.getMessage("bookmarksMenu") || "Bookmarks menu"}</Label>
     <Checkbox bind:checked={bookmarksPermission} />
   </Row>
 
diff --git a/src/pages/options_src/General/SettingsButtons.svelte b/src/pages/options_src/General/SettingsButtons.svelte
index c37a3702..3ea46a2d 100644
--- a/src/pages/options_src/General/SettingsButtons.svelte
+++ b/src/pages/options_src/General/SettingsButtons.svelte
@@ -1,5 +1,5 @@
 <script>
-  let browser = window.browser || window.chrome
+  const browser = window.browser || window.chrome
 
   import { onDestroy } from "svelte"
   import Button from "../../components/Button.svelte"
@@ -85,8 +85,8 @@
 
 <div class="buttons">
   <Button on:click={() => importSettingsInput.click()} disabled={disableButtons}>
-    <ImportIcon />
-    <x data-localise="__MSG_importSettings__">Import Settings</x>
+    <ImportIcon class="margin margin_{document.body.dir}" />
+    <x data-localise="__MSG_importSettings__">{browser.i18n.getMessage("importSettings") || "Import Settings"}</x>
   </Button>
   <input
     type="file"
@@ -97,22 +97,33 @@
   />
 
   <Button on:click={exportSettings} disabled={disableButtons}>
-    <ExportIcon />
-    <x data-localise="__MSG_exportSettings__">Export Settings</x>
+    <ExportIcon class="margin margin_{document.body.dir}" />
+    <x data-localise="__MSG_exportSettings__">{browser.i18n.getMessage("exportSettings") || "Export Settings"}</x>
   </Button>
 
   <Button on:click={exportSettingsSync} disabled={disableButtons}>
-    <ExportIcon />
+    <ExportIcon class="margin margin_{document.body.dir}" />
     <x>Export Settings to Sync</x>
   </Button>
 
   <Button on:click={importSettingsSync} disabled={disableButtons}>
-    <ImportIcon />
-    <x>Import Settings from Sync</x>
+    <ImportIcon class="margin margin_{document.body.dir}" />
+    <x>{browser.i18n.getMessage("importSettingsFromSync") || "Import Settings from Sync"}</x>
   </Button>
 
   <Button on:click={resetSettings} disabled={disableButtons}>
-    <ResetIcon />
-    <x>Reset Settings</x>
+    <ResetIcon class="margin margin_{document.body.dir}" />
+    <x>{browser.i18n.getMessage("resetSettings") || "Reset Settings"}</x>
   </Button>
 </div>
+
+<style>
+  :global(.margin) {
+    margin-right: 10px;
+    margin-left: 0;
+  }
+  :global(.margin_rtl) {
+    margin-right: 0;
+    margin-left: 10px;
+  }
+</style>
diff --git a/src/pages/options_src/Services/Instances.svelte b/src/pages/options_src/Services/Instances.svelte
index e62d410d..862bbf7e 100644
--- a/src/pages/options_src/Services/Instances.svelte
+++ b/src/pages/options_src/Services/Instances.svelte
@@ -1,5 +1,5 @@
 <script>
-  let browser = window.browser || window.chrome
+  const browser = window.browser || window.chrome
 
   import Button from "../../components/Button.svelte"
   import AddIcon from "../../icons/AddIcon.svelte"
@@ -28,7 +28,6 @@
   let blacklist
   let redirects
 
-  $: serviceOptions = _options[selectedService]
   $: serviceConf = _config.services[selectedService]
 
   let allInstances = []
@@ -103,18 +102,18 @@
 
 {#if serviceConf.frontends[selectedFrontend].instanceList && redirects && blacklist}
   <hr />
-  <div dir="ltr">
-    <div class="ping">
-      <Button on:click={pingInstances}>
-        <PingIcon />
-        Ping Instances
-      </Button>
-    </div>
 
-    <Row>
-      <Label>Add your favorite instances</Label>
-    </Row>
+  <div class="ping">
+    <Button on:click={pingInstances}>
+      <PingIcon class="margin margin_{document.body.dir}" />
+      {browser.i18n.getMessage("pingInstances") || "Ping Instances"}
+    </Button>
+  </div>
 
+  <Row>
+    <Label>{browser.i18n.getMessage("addYourFavoriteInstances") || "Add your favorite instances"}</Label>
+  </Row>
+  <div dir="ltr">
     <Row>
       <Input
         bind:value={addInstanceValue}
@@ -231,4 +230,13 @@
   a:hover {
     text-decoration: underline;
   }
+
+  :global(.margin) {
+    margin-right: 10px;
+    margin-left: 0;
+  }
+  :global(.margin_rtl) {
+    margin-right: 0;
+    margin-left: 10px;
+  }
 </style>
diff --git a/src/pages/options_src/Services/RedirectType.svelte b/src/pages/options_src/Services/RedirectType.svelte
index 11044080..29c169bc 100644
--- a/src/pages/options_src/Services/RedirectType.svelte
+++ b/src/pages/options_src/Services/RedirectType.svelte
@@ -1,4 +1,6 @@
 <script>
+  const browser = window.browser || window.chrome
+
   import { onDestroy } from "svelte"
   import SvelteSelect from "svelte-select"
   import { options, config } from "../stores"
@@ -26,9 +28,9 @@
   let values
   $: if (serviceConf.frontends[frontendName].embeddable) {
     values = [
-      { value: "both", name: "Both" },
-      { value: "sub_frame", name: "Only Embedded" },
-      { value: "main_frame", name: "Only Not Embedded" },
+      { value: "both", name: browser.i18n.getMessage("both") || "Both" },
+      { value: "sub_frame", name: browser.i18n.getMessage("onlyEmbedded") || "Only Embedded" },
+      { value: "main_frame", name: browser.i18n.getMessage("onlyNotEmbedded") || "Only Not Embedded" },
     ]
   } else if (
     serviceConf.frontends[frontendName].desktopApp &&
@@ -63,7 +65,7 @@
 </script>
 
 <Row>
-  <Label>Redirect Type</Label>
+  <Label>{browser.i18n.getMessage("redirectType") || "Redirect Type"}</Label>
   <Select
     value={serviceOptions.redirectType}
     onChange={e => {
@@ -76,7 +78,7 @@
 
 {#if serviceConf.frontends[frontendName].desktopApp && serviceOptions.redirectType != "main_frame"}
   <Row>
-    <Label>Embed Frontend</Label>
+    <Label>{browser.i18n.getMessage("embedFrontend") || "Embed Frontend"}</Label>
     <SvelteSelect
       clearable={false}
       class="svelte_select"
diff --git a/src/pages/options_src/Services/Services.svelte b/src/pages/options_src/Services/Services.svelte
index 9c4e6c97..4e719447 100644
--- a/src/pages/options_src/Services/Services.svelte
+++ b/src/pages/options_src/Services/Services.svelte
@@ -1,4 +1,6 @@
 <script>
+  const browser = window.browser || window.chrome
+
   import Row from "../../components/Row.svelte"
   import Label from "../../components/Label.svelte"
   import Select from "../../components/Select.svelte"
@@ -33,32 +35,34 @@
       Service:
       <a href={serviceConf.url} target="_blank" rel="noopener noreferrer">{serviceConf.url}</a>
     </Label>
-    <SvelteSelect
-      clearable={false}
-      class="svelte_select"
-      value={selectedService}
-      on:change={e => (selectedService = e.detail.value)}
-      items={[
-        ...Object.entries(_config.services).map(([serviceKey, service]) => {
-          return { value: serviceKey, label: service.name }
-        }),
-      ]}
-    >
-      <div class="slot" slot="item" let:item>
-        <ServiceIcon details={item} />
-        {item.label}
-      </div>
-      <div class="slot" slot="selection" let:selection>
-        <ServiceIcon details={selection} />
-        {selection.label}
-      </div>
-    </SvelteSelect>
+    <div dir="ltr">
+      <SvelteSelect
+        clearable={false}
+        class="svelte_select"
+        value={selectedService}
+        on:change={e => (selectedService = e.detail.value)}
+        items={[
+          ...Object.entries(_config.services).map(([serviceKey, service]) => {
+            return { value: serviceKey, label: service.name }
+          }),
+        ]}
+      >
+        <div class="slot" slot="item" let:item>
+          <ServiceIcon details={item} />
+          {item.label}
+        </div>
+        <div class="slot" slot="selection" let:selection>
+          <ServiceIcon details={selection} />
+          {selection.label}
+        </div>
+      </SvelteSelect>
+    </div>
   </Row>
 
   <hr />
 
   <Row>
-    <Label>Enable</Label>
+    <Label>{browser.i18n.getMessage("enable") || "Enable"}</Label>
     <Checkbox
       checked={serviceOptions.enabled}
       onChange={e => {
@@ -70,7 +74,7 @@
 
   <div style={!serviceOptions.enabled && "pointer-events: none;opacity: 0.4;user-select: none;"}>
     <Row>
-      <Label>Show in popup</Label>
+      <Label>{browser.i18n.getMessage("showInPopup") || "Show in popup"}</Label>
       <Checkbox
         checked={_options.popupServices.includes(selectedService)}
         onChange={e => {
@@ -87,42 +91,44 @@
 
     <Row>
       <Label>
-        Frontend:
+        {browser.i18n.getMessage("frontend") || "Frontend"}:
         <a href={frontendWebsite} target="_blank" rel="noopener noreferrer">
           {frontendWebsite}
         </a>
       </Label>
-
-      <SvelteSelect
-        clearable={false}
-        class="svelte_select"
-        value={serviceOptions.frontend}
-        on:change={e => {
-          serviceOptions.frontend = e.detail.value
-          options.set(_options)
-        }}
-        items={[
-          ...Object.entries(serviceConf.frontends).map(([frontendId, frontend]) => ({
-            value: frontendId,
-            label: frontend.name,
-          })),
-        ]}
-      >
-        <div class="slot" slot="item" let:item>
-          <FrontendIcon details={item} {selectedService} />
-          {item.label}
-        </div>
-        <div class="slot" slot="selection" let:selection>
-          <FrontendIcon details={selection} {selectedService} />
-          {selection.label}
-        </div>
-      </SvelteSelect>
+      <div dir="ltr">
+        <SvelteSelect
+          clearable={false}
+          dir="ltr"
+          class="svelte_select"
+          value={serviceOptions.frontend}
+          on:change={e => {
+            serviceOptions.frontend = e.detail.value
+            options.set(_options)
+          }}
+          items={[
+            ...Object.entries(serviceConf.frontends).map(([frontendId, frontend]) => ({
+              value: frontendId,
+              label: frontend.name,
+            })),
+          ]}
+        >
+          <div class="slot" slot="item" let:item>
+            <FrontendIcon details={item} {selectedService} />
+            {item.label}
+          </div>
+          <div class="slot" slot="selection" let:selection>
+            <FrontendIcon details={selection} {selectedService} />
+            {selection.label}
+          </div>
+        </SvelteSelect>
+      </div>
     </Row>
 
     <RedirectType {selectedService} />
 
     <Row>
-      <Label>Unsupported embeds handling</Label>
+      <Label>{browser.i18n.getMessage("unsupportedIframesHandling") || "Unsupported embeds handling"}</Label>
       <Select
         value={serviceOptions.unsupportedUrls}
         onChange={e => {
@@ -130,8 +136,8 @@
           options.set(_options)
         }}
         values={[
-          { value: "bypass", name: "Bypass" },
-          { value: "block", name: "Block" },
+          { value: "bypass", name: browser.i18n.getMessage("bypass") || "Bypass" },
+          { value: "block", name: browser.i18n.getMessage("block") || "Block" },
         ]}
       />
     </Row>
@@ -139,13 +145,14 @@
     {#if selectedService == "search"}
       <Row>
         <Label>
-          Set LibRedirect as Default Search Engine. For how to do in chromium browsers, click
+          {@html browser.i18n.getMessage("searchHint") ||
+            `Set LibRedirect as Default Search Engine. For how to do in chromium browsers, click
           <a
             href="https://libredirect.github.io/docs.html#search_engine_chromium"
             target="_blank"
             rel="noopener noreferrer"
             >here
-          </a>.
+          </a>.`}
         </Label>
       </Row>
     {/if}
@@ -184,8 +191,10 @@
     justify-content: start;
     align-items: center;
   }
+
   :global(.svelte_select img, .svelte_select svg) {
     margin-right: 10px;
+    margin-left: 0;
     height: 26px;
     width: 26px;
     color: var(--text);
diff --git a/src/pages/options_src/Sidebar.svelte b/src/pages/options_src/Sidebar.svelte
index 4a808268..fb515f53 100644
--- a/src/pages/options_src/Sidebar.svelte
+++ b/src/pages/options_src/Sidebar.svelte
@@ -1,4 +1,6 @@
 <script>
+  const browser = window.browser || window.chrome
+
   import { page } from "./stores"
   import GeneralIcon from "../icons/GeneralIcon.svelte"
   import ServicesIcon from "../icons/ServicesIcon.svelte"
@@ -7,16 +9,16 @@
 
 <div>
   <a href="#general" on:click={() => page.set("general")} style={$page == "general" && "color: var(--active);"}>
-    <GeneralIcon style="margin-right: 5px" />
-    <span data-localise="__MSG_general__">General</span>
+    <GeneralIcon class="margin margin_{document.body.dir}" />
+    <span data-localise="__MSG_general__">{browser.i18n.getMessage("general") || "General"}</span>
   </a>
   <a href="#services" on:click={() => page.set("services")} style={$page == "services" && "color: var(--active);"}>
-    <ServicesIcon style="margin-right: 5px" />
-    <span data-localise="__MSG_services__">Services</span>
+    <ServicesIcon class="margin margin_{document.body.dir}" />
+    <span data-localise="__MSG_services__">{browser.i18n.getMessage("general") || "Services"}</span>
   </a>
   <a href="https://libredirect.github.io" target="_blank" rel="noopener noreferrer">
-    <AboutIcon style="margin-right: 5px" />
-    <span data-localise="__MSG_about__">About</span>
+    <AboutIcon class="margin margin_{document.body.dir}" />
+    <span data-localise="__MSG_about__">{browser.i18n.getMessage("about") || "About"}</span>
   </a>
 </div>
 
@@ -54,4 +56,13 @@
       margin: 5px;
     }
   }
+
+  :global(.margin) {
+    margin-right: 5px;
+    margin-left: 0;
+  }
+  :global(.margin_rtl) {
+    margin-right: 0;
+    margin-left: 5px;
+  }
 </style>
diff --git a/src/pages/popup_src/App.svelte b/src/pages/popup_src/App.svelte
index cf88234d..df37d55d 100644
--- a/src/pages/popup_src/App.svelte
+++ b/src/pages/popup_src/App.svelte
@@ -1,5 +1,5 @@
 <script>
-  let browser = window.browser || window.chrome
+  const browser = window.browser || window.chrome
 
   import utils from "../../assets/javascripts/utils.js"
   import { onDestroy } from "svelte"
diff --git a/src/pages/popup_src/Buttons.svelte b/src/pages/popup_src/Buttons.svelte
index 449404ba..bfa162f8 100644
--- a/src/pages/popup_src/Buttons.svelte
+++ b/src/pages/popup_src/Buttons.svelte
@@ -1,5 +1,5 @@
 <script>
-  let browser = window.browser || window.chrome
+  const browser = window.browser || window.chrome
 
   import Row from "./components/Row.svelte"
   import Label from "../components/Label.svelte"
@@ -39,55 +39,57 @@
   })
 </script>
 
-{#if redirect}
-  <Row class="interactive" on:click={() => browser.runtime.sendMessage("redirectTab")}>
-    <Label>Redirect</Label>
-    <RedirectIcon />
-  </Row>
-{/if}
-
-{#if switchInstance}
-  <Row
-    class="interactive"
-    on:click={async () => browser.tabs.update({ url: await servicesHelper.switchInstance(url) })}
-  >
-    <Label>Switch Instance</Label>
-    <SwitchInstanceIcon />
-  </Row>
-{/if}
+<div class={document.body.dir}>
+  {#if redirect}
+    <Row class="interactive" on:click={() => browser.runtime.sendMessage("redirectTab")}>
+      <Label>{browser.i18n.getMessage("redirect") || "Redirect"}</Label>
+      <RedirectIcon />
+    </Row>
+  {/if}
 
-{#if redirectToOriginal}
-  <Row class="interactive" on:click={() => servicesHelper.copyRaw(url)}>
-    <Label>Copy Original</Label>
-    <CopyIcon />
-  </Row>
-  <Row class="interactive" on:click={() => browser.runtime.sendMessage("reverseTab")}>
-    <Label>Redirect To Original</Label>
-    <RedirectToOriginalIcon />
-  </Row>
-{/if}
+  {#if switchInstance}
+    <Row
+      class="interactive"
+      on:click={async () => browser.tabs.update({ url: await servicesHelper.switchInstance(url) })}
+    >
+      <Label>{browser.i18n.getMessage("switchInstance") || "Switch Instance"}</Label>
+      <SwitchInstanceIcon />
+    </Row>
+  {/if}
 
-{#if redirect || switchInstance || redirectToOriginal}
-  <hr />
-{/if}
+  {#if redirectToOriginal}
+    <Row class="interactive" on:click={() => servicesHelper.copyRaw(url)}>
+      <Label>{browser.i18n.getMessage("copyOriginal") || "Copy Original"}</Label>
+      <CopyIcon />
+    </Row>
+    <Row class="interactive" on:click={() => browser.runtime.sendMessage("reverseTab")}>
+      <Label>{browser.i18n.getMessage("redirectToOriginal" || "Redirect to Original")}</Label>
+      <RedirectToOriginalIcon />
+    </Row>
+  {/if}
 
-{#if currentService}
-  <Switch serviceKey={currentService} {url} />
-  <hr />
-{/if}
+  {#if redirect || switchInstance || redirectToOriginal}
+    <hr />
+  {/if}
 
-{#each _options.popupServices as serviceKey}
-  {#if currentService !== serviceKey}
-    <Switch {serviceKey} {url} />
+  {#if currentService}
+    <Switch serviceKey={currentService} {url} />
+    <hr />
   {/if}
-{/each}
 
-<hr />
+  {#each _options.popupServices as serviceKey}
+    {#if currentService !== serviceKey}
+      <Switch {serviceKey} {url} />
+    {/if}
+  {/each}
+
+  <hr />
 
-<Row class="interactive" on:click={() => window.open(browser.runtime.getURL("pages/options/index.html"), "_blank")}>
-  <Label>Settings</Label>
-  <SettingsIcon />
-</Row>
+  <Row class="interactive" on:click={() => window.open(browser.runtime.getURL("pages/options/index.html"), "_blank")}>
+    <Label>{browser.i18n.getMessage("settings")}</Label>
+    <SettingsIcon />
+  </Row>
+</div>
 
 <style>
   :global(.interactive) {
@@ -103,8 +105,14 @@
 
   :global(img, svg) {
     margin-right: 10px;
+    margin-left: 0;
     height: 26px;
     width: 26px;
     color: var(--text);
   }
+
+  :global(.rtl img, .rtl svg) {
+    margin-right: 0;
+    margin-left: 10px;
+  }
 </style>
diff --git a/src/pages/popup_src/components/Switch.svelte b/src/pages/popup_src/components/Switch.svelte
index f420caa1..e581e5f4 100644
--- a/src/pages/popup_src/components/Switch.svelte
+++ b/src/pages/popup_src/components/Switch.svelte
@@ -1,5 +1,5 @@
 <script>
-  let browser = window.browser || window.chrome
+  const browser = window.browser || window.chrome
 
   import Checkbox from "../../components/Checkbox.svelte"
   import Label from "../../components/Label.svelte"
@@ -35,7 +35,7 @@
   </div>
   <div>
     <Checkbox
-      style="margin-right:5px"
+      class="margin margin_{document.body.dir}"
       label="Enable"
       checked={_options[serviceKey].enabled}
       onChange={e => {
@@ -55,4 +55,13 @@
     display: flex;
     align-items: center;
   }
+
+  :global(.margin) {
+    margin-right: 5px;
+    margin-left: 0;
+  }
+  :global(.margin_rtl) {
+    margin-right: 0;
+    margin-left: 5px;
+  }
 </style>
-- 
cgit 1.4.1


From ed0c90ec3de1fa5fa8f7ebc138d62174eb07b363 Mon Sep 17 00:00:00 2001
From: ManeraKai <manerakai@protonmail.com>
Date: Sat, 27 Jul 2024 12:11:54 +0300
Subject: Cleaned code

---
 src/pages/components/Button.svelte                 |  2 +-
 src/pages/components/Input.svelte                  |  2 +-
 src/pages/components/Row.svelte                    |  2 +-
 src/pages/options_src/General/General.svelte       |  6 ++--
 .../options_src/General/SettingsButtons.svelte     | 34 +++++++---------------
 src/pages/options_src/Sidebar.svelte               |  6 ++--
 6 files changed, 18 insertions(+), 34 deletions(-)

(limited to 'src/pages/options_src')

diff --git a/src/pages/components/Button.svelte b/src/pages/components/Button.svelte
index 3405c2ea..8836b47e 100644
--- a/src/pages/components/Button.svelte
+++ b/src/pages/components/Button.svelte
@@ -1,4 +1,4 @@
-<button on:click {...$$props}>
+<button {...$$restProps} on:click {...$$props}>
   <slot></slot>
 </button>
 
diff --git a/src/pages/components/Input.svelte b/src/pages/components/Input.svelte
index 97a47e6d..59e584db 100644
--- a/src/pages/components/Input.svelte
+++ b/src/pages/components/Input.svelte
@@ -3,7 +3,7 @@
 </script>
 
 <input
-  {...$$props}
+  {...$$restProps}
   bind:value
   on:blur
   on:change
diff --git a/src/pages/components/Row.svelte b/src/pages/components/Row.svelte
index 68b528e3..09246d98 100644
--- a/src/pages/components/Row.svelte
+++ b/src/pages/components/Row.svelte
@@ -1,4 +1,4 @@
-<div {...$$props} on:click>
+<div {...$$restProps} on:click>
   <slot></slot>
 </div>
 
diff --git a/src/pages/options_src/General/General.svelte b/src/pages/options_src/General/General.svelte
index 732ad83b..37c38a0a 100644
--- a/src/pages/options_src/General/General.svelte
+++ b/src/pages/options_src/General/General.svelte
@@ -38,7 +38,6 @@
         _options.theme = e.target.options[e.target.options.selectedIndex].value
         options.set(_options)
       }}
-      ariaLabel="select theme"
     />
   </Row>
 
@@ -55,7 +54,6 @@
         _options.fetchInstances = e.target.options[e.target.options.selectedIndex].value
         options.set(_options)
       }}
-      ariaLabel={"Select fetch public instances"}
     />
   </Row>
 
@@ -75,7 +73,7 @@
     <Checkbox bind:checked={bookmarksPermission} />
   </Row>
 
-  <Exceptions opts={_options} />
+  <Exceptions />
 
-  <SettingsButtons opts={_options} />
+  <SettingsButtons />
 </div>
diff --git a/src/pages/options_src/General/SettingsButtons.svelte b/src/pages/options_src/General/SettingsButtons.svelte
index 3ea46a2d..2f574199 100644
--- a/src/pages/options_src/General/SettingsButtons.svelte
+++ b/src/pages/options_src/General/SettingsButtons.svelte
@@ -14,24 +14,18 @@
   const unsubscribe = options.subscribe(val => (_options = val))
   onDestroy(unsubscribe)
 
-  let disableButtons = false
-
   let importSettingsInput
   let importSettingsFiles
   $: if (importSettingsFiles) {
-    disableButtons = true
     const reader = new FileReader()
     reader.readAsText(importSettingsFiles[0])
     reader.onload = async () => {
       const data = JSON.parse(reader.result)
       if ("theme" in data && data.version == browser.runtime.getManifest().version) {
         browser.storage.local.clear(async () => {
-          console.log("clearing")
           options.set(data)
-          disableButtons = false
         })
       } else {
-        console.log("incompatible settings")
         alert("Incompatible settings")
       }
     }
@@ -42,26 +36,21 @@
   }
 
   async function exportSettings() {
-    disableButtons = true
     _options.version = browser.runtime.getManifest().version
     const resultString = JSON.stringify(_options, null, "  ")
     const anchor = document.createElement("a")
     anchor.href = "data:application/json;base64," + btoa(resultString)
     anchor.download = `libredirect-settings-v${_options.version}.json`
     anchor.click()
-    disableButtons = false
   }
 
   async function exportSettingsSync() {
-    disableButtons = true
     _options.version = browser.runtime.getManifest().version
     await servicesHelper.initDefaults()
     browser.storage.sync.set({ options: _options })
-    disableButtons = false
   }
 
   async function importSettingsSync() {
-    disableButtons = true
     browser.storage.sync.get({ options }, r => {
       const optionsSync = r.options
       if (optionsSync.version == browser.runtime.getManifest().version) {
@@ -69,24 +58,21 @@
       } else {
         alert("Error")
       }
-      disableButtons = false
     })
   }
 
   async function resetSettings() {
-    disableButtons = true
     browser.storage.local.clear(async () => {
       await servicesHelper.initDefaults()
       options.set(await utils.getOptions())
-      disableButtons = false
     })
   }
 </script>
 
 <div class="buttons">
-  <Button on:click={() => importSettingsInput.click()} disabled={disableButtons}>
+  <Button on:click={() => importSettingsInput.click()}>
     <ImportIcon class="margin margin_{document.body.dir}" />
-    <x data-localise="__MSG_importSettings__">{browser.i18n.getMessage("importSettings") || "Import Settings"}</x>
+    {browser.i18n.getMessage("importSettings") || "Import Settings"}
   </Button>
   <input
     type="file"
@@ -96,24 +82,24 @@
     bind:files={importSettingsFiles}
   />
 
-  <Button on:click={exportSettings} disabled={disableButtons}>
+  <Button on:click={exportSettings}>
     <ExportIcon class="margin margin_{document.body.dir}" />
-    <x data-localise="__MSG_exportSettings__">{browser.i18n.getMessage("exportSettings") || "Export Settings"}</x>
+    {browser.i18n.getMessage("exportSettings") || "Export Settings"}
   </Button>
 
-  <Button on:click={exportSettingsSync} disabled={disableButtons}>
+  <Button on:click={exportSettingsSync}>
     <ExportIcon class="margin margin_{document.body.dir}" />
-    <x>Export Settings to Sync</x>
+    {browser.i18n.getMessage("exportSettingsToSync") || "Export Settings to Sync"}
   </Button>
 
-  <Button on:click={importSettingsSync} disabled={disableButtons}>
+  <Button on:click={importSettingsSync}>
     <ImportIcon class="margin margin_{document.body.dir}" />
-    <x>{browser.i18n.getMessage("importSettingsFromSync") || "Import Settings from Sync"}</x>
+    {browser.i18n.getMessage("importSettingsFromSync") || "Import Settings from Sync"}
   </Button>
 
-  <Button on:click={resetSettings} disabled={disableButtons}>
+  <Button on:click={resetSettings}>
     <ResetIcon class="margin margin_{document.body.dir}" />
-    <x>{browser.i18n.getMessage("resetSettings") || "Reset Settings"}</x>
+    {browser.i18n.getMessage("resetSettings") || "Reset Settings"}
   </Button>
 </div>
 
diff --git a/src/pages/options_src/Sidebar.svelte b/src/pages/options_src/Sidebar.svelte
index fb515f53..97780b15 100644
--- a/src/pages/options_src/Sidebar.svelte
+++ b/src/pages/options_src/Sidebar.svelte
@@ -10,15 +10,15 @@
 <div>
   <a href="#general" on:click={() => page.set("general")} style={$page == "general" && "color: var(--active);"}>
     <GeneralIcon class="margin margin_{document.body.dir}" />
-    <span data-localise="__MSG_general__">{browser.i18n.getMessage("general") || "General"}</span>
+    {browser.i18n.getMessage("general") || "General"}
   </a>
   <a href="#services" on:click={() => page.set("services")} style={$page == "services" && "color: var(--active);"}>
     <ServicesIcon class="margin margin_{document.body.dir}" />
-    <span data-localise="__MSG_services__">{browser.i18n.getMessage("general") || "Services"}</span>
+    {browser.i18n.getMessage("general") || "Services"}
   </a>
   <a href="https://libredirect.github.io" target="_blank" rel="noopener noreferrer">
     <AboutIcon class="margin margin_{document.body.dir}" />
-    <span data-localise="__MSG_about__">{browser.i18n.getMessage("about") || "About"}</span>
+    {browser.i18n.getMessage("about") || "About"}
   </a>
 </div>
 
-- 
cgit 1.4.1


From a9ecaf4ac0d97510b95fe965eebd543d53e3e5ac Mon Sep 17 00:00:00 2001
From: ManeraKai <manerakai@protonmail.com>
Date: Fri, 2 Aug 2024 16:27:54 +0300
Subject: Improved mobile support. Fixed
 https://github.com/libredirect/browser_extension/issues/956

---
 package.json                                    |   2 +-
 src/pages/background/background.js              | 404 ++++++++++++------------
 src/pages/components/Checkbox.svelte            |   1 -
 src/pages/options_src/General/General.svelte    |  39 ++-
 src/pages/options_src/Services/Instances.svelte |   1 -
 src/pages/options_src/Services/Services.svelte  |  10 +-
 src/pages/popup_src/Buttons.svelte              |  30 +-
 src/pages/popup_src/components/Switch.svelte    |   5 +-
 8 files changed, 273 insertions(+), 219 deletions(-)

(limited to 'src/pages/options_src')

diff --git a/package.json b/package.json
index 2a79b660..2895734d 100644
--- a/package.json
+++ b/package.json
@@ -10,7 +10,7 @@
     "start": "web-ext run",
     "nightly": "web-ext run --firefox=/home/esmail/software/firefox_nightly/firefox",
     "start_ar": "web-ext run --firefox=/home/esmail/software/firefox_ar/firefox",
-    "android": "web-ext run -t firefox-android --adb-device emulator-5554 --firefox-apk org.mozilla.fenix ",
+    "android": "web-ext run -t firefox-android --adb-device emulator-5554 --firefox-apk org.mozilla.firefox --adb-remove-old-artifacts",
     "build": "web-ext build",
     "test": "web-ext lint",
     "html": "rollup -c --config-popup && rollup -c --config-options"
diff --git a/src/pages/background/background.js b/src/pages/background/background.js
index e3d9fb31..d42e5027 100644
--- a/src/pages/background/background.js
+++ b/src/pages/background/background.js
@@ -91,221 +91,233 @@ browser.tabs.onRemoved.addListener(tabId => {
   }
 })
 
-browser.commands.onCommand.addListener(async command => {
-  browser.tabs.query({ active: true, currentWindow: true }, async tabs => {
-    const url = new URL(tabs[0].url)
-    switch (command) {
-      case "switchInstance": {
-        const newUrl = await servicesHelper.switchInstance(url)
-        if (newUrl) browser.tabs.update({ url: newUrl })
-        break
-      }
-      case "copyRaw":
-        servicesHelper.copyRaw(url)
-        break
-      case "redirect":
-        browser.tabs.query({ active: true, currentWindow: true }, async tabs => {
-          if (tabs[0].url) {
-            const url = new URL(tabs[0].url)
-            const newUrl = servicesHelper.redirect(url, "main_frame", null, true)
-            if (newUrl) {
-              browser.tabs.update(tabs[0].id, { url: newUrl }, () => {
-                tabIdRedirects[tabs[0].id] = true
-              })
-            }
-          }
-        })
-        break
-      case "reverse":
-        browser.tabs.query({ active: true, currentWindow: true }, async tabs => {
-          if (tabs[0].url) {
-            const url = new URL(tabs[0].url)
-            const newUrl = await servicesHelper.reverse(url)
-            if (newUrl) {
-              browser.tabs.update(tabs[0].id, { url: newUrl }, () => {
-                tabIdRedirects[tabs[0].id] = false
-              })
-            }
+browser.runtime.getPlatformInfo(r => {
+  if (r.os != "fuchsia" && r.os != "ios" && r.os != "android") {
+    browser.commands.onCommand.addListener(async command => {
+      browser.tabs.query({ active: true, currentWindow: true }, async tabs => {
+        const url = new URL(tabs[0].url)
+        switch (command) {
+          case "switchInstance": {
+            const newUrl = await servicesHelper.switchInstance(url)
+            if (newUrl) browser.tabs.update({ url: newUrl })
+            break
           }
-        })
-        break
-    }
-  })
-})
-
-browser.contextMenus.create({
-  id: "settingsTab",
-  title: browser.i18n.getMessage("settings"),
-  contexts: ["browser_action"],
-})
-browser.contextMenus.create({
-  id: "switchInstanceTab",
-  title: browser.i18n.getMessage("switchInstance"),
-  contexts: ["browser_action"],
-})
-browser.contextMenus.create({ id: "copyReverseTab", title: "Copy Original", contexts: ["browser_action"] })
-browser.contextMenus.create({ id: "redirectTab", title: "Redirect", contexts: ["browser_action"] })
-browser.contextMenus.create({ id: "reverseTab", title: "Redirect To Original", contexts: ["browser_action"] })
+          case "copyRaw":
+            servicesHelper.copyRaw(url)
+            break
+          case "redirect":
+            browser.tabs.query({ active: true, currentWindow: true }, async tabs => {
+              if (tabs[0].url) {
+                const url = new URL(tabs[0].url)
+                const newUrl = servicesHelper.redirect(url, "main_frame", null, true)
+                if (newUrl) {
+                  browser.tabs.update(tabs[0].id, { url: newUrl }, () => {
+                    tabIdRedirects[tabs[0].id] = true
+                  })
+                }
+              }
+            })
+            break
+          case "reverse":
+            browser.tabs.query({ active: true, currentWindow: true }, async tabs => {
+              if (tabs[0].url) {
+                const url = new URL(tabs[0].url)
+                const newUrl = await servicesHelper.reverse(url)
+                if (newUrl) {
+                  browser.tabs.update(tabs[0].id, { url: newUrl }, () => {
+                    tabIdRedirects[tabs[0].id] = false
+                  })
+                }
+              }
+            })
+            break
+        }
+      })
+    })
 
-browser.contextMenus.create({ id: "redirectLink", title: "Redirect", contexts: ["link"] })
-browser.contextMenus.create({ id: "redirectLinkInNewTab", title: "Redirect In New Tab", contexts: ["link"] })
-browser.contextMenus.create({ id: "reverseLink", title: "Redirect To Original", contexts: ["link"] })
-browser.contextMenus.create({ id: "reverseLinkInNewTab", title: "Redirect To Original In New Tab", contexts: ["link"] })
-browser.contextMenus.create({ id: "copyReverseLink", title: "Copy Original", contexts: ["link"] })
-browser.contextMenus.create({ id: "bypassLink", title: "Bypass", contexts: ["link"] })
-browser.contextMenus.create({ id: "bypassLinkInNewTab", title: "Bypass In New Tab", contexts: ["link"] })
+    browser.contextMenus.create({
+      id: "settingsTab",
+      title: browser.i18n.getMessage("settings"),
+      contexts: ["browser_action"],
+    })
+    browser.contextMenus.create({
+      id: "switchInstanceTab",
+      title: browser.i18n.getMessage("switchInstance"),
+      contexts: ["browser_action"],
+    })
+    browser.contextMenus.create({ id: "copyReverseTab", title: "Copy Original", contexts: ["browser_action"] })
+    browser.contextMenus.create({ id: "redirectTab", title: "Redirect", contexts: ["browser_action"] })
+    browser.contextMenus.create({ id: "reverseTab", title: "Redirect To Original", contexts: ["browser_action"] })
 
-if (!isChrome) {
-  browser.contextMenus.create({ id: "redirectBookmark", title: "Redirect", contexts: ["bookmark"] })
-  browser.contextMenus.create({ id: "redirectBookmarkInNewTab", title: "Redirect In New Tab", contexts: ["bookmark"] })
-  browser.contextMenus.create({ id: "reverseBookmark", title: "Redirect To Original", contexts: ["bookmark"] })
-  browser.contextMenus.create({
-    id: "reverseBookmarkInNewTab",
-    title: "Redirect To Original In New Tab",
-    contexts: ["bookmark"],
-  })
-  browser.contextMenus.create({ id: "copyReverseBookmark", title: "Copy Original", contexts: ["bookmark"] })
-  browser.contextMenus.create({ id: "bypassBookmark", title: "Bypass", contexts: ["bookmark"] })
-  browser.contextMenus.create({ id: "bypassBookmarkInNewTab", title: "Bypass In New Tab", contexts: ["bookmark"] })
-}
+    browser.contextMenus.create({ id: "redirectLink", title: "Redirect", contexts: ["link"] })
+    browser.contextMenus.create({ id: "redirectLinkInNewTab", title: "Redirect In New Tab", contexts: ["link"] })
+    browser.contextMenus.create({ id: "reverseLink", title: "Redirect To Original", contexts: ["link"] })
+    browser.contextMenus.create({
+      id: "reverseLinkInNewTab",
+      title: "Redirect To Original In New Tab",
+      contexts: ["link"],
+    })
+    browser.contextMenus.create({ id: "copyReverseLink", title: "Copy Original", contexts: ["link"] })
+    browser.contextMenus.create({ id: "bypassLink", title: "Bypass", contexts: ["link"] })
+    browser.contextMenus.create({ id: "bypassLinkInNewTab", title: "Bypass In New Tab", contexts: ["link"] })
 
-browser.contextMenus.onClicked.addListener(async info => {
-  switch (info.menuItemId) {
-    case "switchInstanceTab": {
-      const url = new URL(info.pageUrl)
-      const newUrl = await servicesHelper.switchInstance(url)
-      if (newUrl) browser.tabs.update({ url: newUrl })
-      return
+    if (!isChrome) {
+      browser.contextMenus.create({ id: "redirectBookmark", title: "Redirect", contexts: ["bookmark"] })
+      browser.contextMenus.create({
+        id: "redirectBookmarkInNewTab",
+        title: "Redirect In New Tab",
+        contexts: ["bookmark"],
+      })
+      browser.contextMenus.create({ id: "reverseBookmark", title: "Redirect To Original", contexts: ["bookmark"] })
+      browser.contextMenus.create({
+        id: "reverseBookmarkInNewTab",
+        title: "Redirect To Original In New Tab",
+        contexts: ["bookmark"],
+      })
+      browser.contextMenus.create({ id: "copyReverseBookmark", title: "Copy Original", contexts: ["bookmark"] })
+      browser.contextMenus.create({ id: "bypassBookmark", title: "Bypass", contexts: ["bookmark"] })
+      browser.contextMenus.create({ id: "bypassBookmarkInNewTab", title: "Bypass In New Tab", contexts: ["bookmark"] })
     }
-    case "settingsTab":
-      browser.runtime.openOptionsPage()
-      return
-    case "copyReverseTab":
-      browser.tabs.query({ active: true, currentWindow: true }, async tabs => {
-        if (tabs[0].url) {
-          const url = new URL(tabs[0].url)
-          servicesHelper.copyRaw(url)
+
+    browser.contextMenus.onClicked.addListener(async info => {
+      switch (info.menuItemId) {
+        case "switchInstanceTab": {
+          const url = new URL(info.pageUrl)
+          const newUrl = await servicesHelper.switchInstance(url)
+          if (newUrl) browser.tabs.update({ url: newUrl })
+          return
         }
-      })
-      return
-    case "reverseTab":
-      browser.tabs.query({ active: true, currentWindow: true }, async tabs => {
-        if (tabs[0].url) {
-          const url = new URL(tabs[0].url)
-          const newUrl = await servicesHelper.reverse(url)
-          if (newUrl) {
-            browser.tabs.update(tabs[0].id, { url: newUrl }, () => {
-              tabIdRedirects[tabs[0].id] = false
-            })
-          }
+        case "settingsTab":
+          browser.runtime.openOptionsPage()
+          return
+        case "copyReverseTab":
+          browser.tabs.query({ active: true, currentWindow: true }, async tabs => {
+            if (tabs[0].url) {
+              const url = new URL(tabs[0].url)
+              servicesHelper.copyRaw(url)
+            }
+          })
+          return
+        case "reverseTab":
+          browser.tabs.query({ active: true, currentWindow: true }, async tabs => {
+            if (tabs[0].url) {
+              const url = new URL(tabs[0].url)
+              const newUrl = await servicesHelper.reverse(url)
+              if (newUrl) {
+                browser.tabs.update(tabs[0].id, { url: newUrl }, () => {
+                  tabIdRedirects[tabs[0].id] = false
+                })
+              }
+            }
+          })
+          return
+        case "redirectTab":
+          browser.tabs.query({ active: true, currentWindow: true }, async tabs => {
+            if (tabs[0].url) {
+              const url = new URL(tabs[0].url)
+              const newUrl = servicesHelper.redirect(url, "main_frame", null, true)
+              if (newUrl) {
+                browser.tabs.update(tabs[0].id, { url: newUrl }, () => {
+                  tabIdRedirects[tabs[0].id] = true
+                })
+              }
+            }
+          })
+          return
+        case "copyReverseLink": {
+          const url = new URL(info.linkUrl)
+          await servicesHelper.copyRaw(url)
+          return
         }
-      })
-      return
-    case "redirectTab":
-      browser.tabs.query({ active: true, currentWindow: true }, async tabs => {
-        if (tabs[0].url) {
-          const url = new URL(tabs[0].url)
+        case "redirectLink":
+        case "redirectLinkInNewTab": {
+          const url = new URL(info.linkUrl)
           const newUrl = servicesHelper.redirect(url, "main_frame", null, true)
           if (newUrl) {
-            browser.tabs.update(tabs[0].id, { url: newUrl }, () => {
-              tabIdRedirects[tabs[0].id] = true
-            })
+            if (info.menuItemId == "redirectLink") browser.tabs.update({ url: newUrl })
+            else browser.tabs.create({ url: newUrl })
           }
+          return
         }
-      })
-      return
-    case "copyReverseLink": {
-      const url = new URL(info.linkUrl)
-      await servicesHelper.copyRaw(url)
-      return
-    }
-    case "redirectLink":
-    case "redirectLinkInNewTab": {
-      const url = new URL(info.linkUrl)
-      const newUrl = servicesHelper.redirect(url, "main_frame", null, true)
-      if (newUrl) {
-        if (info.menuItemId == "redirectLink") browser.tabs.update({ url: newUrl })
-        else browser.tabs.create({ url: newUrl })
-      }
-      return
-    }
-    case "reverseLink":
-    case "reverseLinkInNewTab": {
-      const url = new URL(info.linkUrl)
-      const newUrl = await servicesHelper.reverse(url)
-      if (newUrl) {
-        if (info.menuItemId == "reverseLink") {
-          browser.tabs.update({ url: newUrl }, tab => {
-            tabIdRedirects[tab.id] = false
-          })
-        } else {
-          browser.tabs.create({ url: newUrl }, tab => {
-            tabIdRedirects[tab.id] = false
-          })
-        }
-      }
-      return
-    }
-    case "bypassLink":
-    case "bypassLinkInNewTab": {
-      const url = new URL(info.linkUrl)
-      if (info.menuItemId == "bypassLink") {
-        browser.tabs.update({ url: url.href }, tab => {
-          tabIdRedirects[tab.id] = false
-        })
-      } else {
-        browser.tabs.create({ url: url.href }, tab => {
-          tabIdRedirects[tab.id] = false
-        })
-      }
-      return
-    }
-    case "copyReverseBookmark":
-      browser.bookmarks.get(info.bookmarkId, bookmarks => {
-        const url = new URL(bookmarks[0].url)
-        servicesHelper.copyRaw(url)
-      })
-      return
-    case "redirectBookmark":
-    case "redirectBookmarkInNewTab":
-      browser.bookmarks.get(info.bookmarkId, bookmarks => {
-        const url = new URL(bookmarks[0].url)
-        const newUrl = servicesHelper.redirect(url, "main_frame", null, true)
-        if (newUrl) {
-          if (info.menuItemId == "redirectBookmark") browser.tabs.update({ url: newUrl })
-          else browser.tabs.create({ url: newUrl })
+        case "reverseLink":
+        case "reverseLinkInNewTab": {
+          const url = new URL(info.linkUrl)
+          const newUrl = await servicesHelper.reverse(url)
+          if (newUrl) {
+            if (info.menuItemId == "reverseLink") {
+              browser.tabs.update({ url: newUrl }, tab => {
+                tabIdRedirects[tab.id] = false
+              })
+            } else {
+              browser.tabs.create({ url: newUrl }, tab => {
+                tabIdRedirects[tab.id] = false
+              })
+            }
+          }
+          return
         }
-      })
-      return
-    case "reverseBookmark":
-    case "reverseBookmarkInNewTab":
-      browser.bookmarks.get(info.bookmarkId, async bookmarks => {
-        const url = new URL(bookmarks[0].url)
-        const newUrl = await servicesHelper.reverse(url)
-        if (newUrl) {
-          if (info.menuItemId == "reverseBookmark") {
-            browser.tabs.update({ url: newUrl }, tab => {
+        case "bypassLink":
+        case "bypassLinkInNewTab": {
+          const url = new URL(info.linkUrl)
+          if (info.menuItemId == "bypassLink") {
+            browser.tabs.update({ url: url.href }, tab => {
               tabIdRedirects[tab.id] = false
             })
           } else {
-            browser.tabs.create({ url: newUrl }, tab => {
+            browser.tabs.create({ url: url.href }, tab => {
               tabIdRedirects[tab.id] = false
             })
           }
+          return
         }
-      })
-      return
-    case "bypassBookmark":
-    case "bypassBookmarkInNewTab":
-      browser.bookmarks.get(info.bookmarkId, async bookmarks => {
-        const url = new URL(bookmarks[0].url)
-        if (info.menuItemId == "bypassBookmark") {
-          browser.tabs.update({ url: url.href }, tab => (tabIdRedirects[tab.id] = false))
-        } else {
-          browser.tabs.create({ url: url.href }, tab => (tabIdRedirects[tab.id] = false))
-        }
-        return
-      })
+        case "copyReverseBookmark":
+          browser.bookmarks.get(info.bookmarkId, bookmarks => {
+            const url = new URL(bookmarks[0].url)
+            servicesHelper.copyRaw(url)
+          })
+          return
+        case "redirectBookmark":
+        case "redirectBookmarkInNewTab":
+          browser.bookmarks.get(info.bookmarkId, bookmarks => {
+            const url = new URL(bookmarks[0].url)
+            const newUrl = servicesHelper.redirect(url, "main_frame", null, true)
+            if (newUrl) {
+              if (info.menuItemId == "redirectBookmark") browser.tabs.update({ url: newUrl })
+              else browser.tabs.create({ url: newUrl })
+            }
+          })
+          return
+        case "reverseBookmark":
+        case "reverseBookmarkInNewTab":
+          browser.bookmarks.get(info.bookmarkId, async bookmarks => {
+            const url = new URL(bookmarks[0].url)
+            const newUrl = await servicesHelper.reverse(url)
+            if (newUrl) {
+              if (info.menuItemId == "reverseBookmark") {
+                browser.tabs.update({ url: newUrl }, tab => {
+                  tabIdRedirects[tab.id] = false
+                })
+              } else {
+                browser.tabs.create({ url: newUrl }, tab => {
+                  tabIdRedirects[tab.id] = false
+                })
+              }
+            }
+          })
+          return
+        case "bypassBookmark":
+        case "bypassBookmarkInNewTab":
+          browser.bookmarks.get(info.bookmarkId, async bookmarks => {
+            const url = new URL(bookmarks[0].url)
+            if (info.menuItemId == "bypassBookmark") {
+              browser.tabs.update({ url: url.href }, tab => (tabIdRedirects[tab.id] = false))
+            } else {
+              browser.tabs.create({ url: url.href }, tab => (tabIdRedirects[tab.id] = false))
+            }
+            return
+          })
+      }
+    })
   }
 })
 
diff --git a/src/pages/components/Checkbox.svelte b/src/pages/components/Checkbox.svelte
index 9ba9c56c..d42a4f10 100644
--- a/src/pages/components/Checkbox.svelte
+++ b/src/pages/components/Checkbox.svelte
@@ -1,7 +1,6 @@
 <script>
   export let checked
   export let onChange
-  console.log(document.body.dir)
 </script>
 
 <input class={document.body.dir} {...$$restProps} bind:checked on:change={onChange} type="checkbox" />
diff --git a/src/pages/options_src/General/General.svelte b/src/pages/options_src/General/General.svelte
index 37c38a0a..b6ed1b46 100644
--- a/src/pages/options_src/General/General.svelte
+++ b/src/pages/options_src/General/General.svelte
@@ -14,13 +14,30 @@
   const unsubscribe = options.subscribe(val => (_options = val))
   onDestroy(unsubscribe)
 
+  let disableBookmarks = null
+  browser.runtime.getPlatformInfo(r => {
+    switch (r.os) {
+      case "fuchsia":
+      case "ios":
+      case "android":
+        disableBookmarks = true
+        break
+      default:
+        disableBookmarks = false
+    }
+    if (!disableBookmarks) {
+      browser.permissions.contains({ permissions: ["bookmarks"] }, r => (bookmarksPermission = r))
+    }
+  })
+
   let bookmarksPermission
-  browser.permissions.contains({ permissions: ["bookmarks"] }, r => (bookmarksPermission = r))
-  $: if (bookmarksPermission) {
-    browser.permissions.request({ permissions: ["bookmarks"] }, r => (bookmarksPermission = r))
-  } else {
-    browser.permissions.remove({ permissions: ["bookmarks"] })
-    bookmarksPermission = false
+  $: if (disableBookmarks !== null && disableBookmarks === false) {
+    if (bookmarksPermission) {
+      browser.permissions.request({ permissions: ["bookmarks"] }, r => (bookmarksPermission = r))
+    } else {
+      browser.permissions.remove({ permissions: ["bookmarks"] })
+      bookmarksPermission = false
+    }
   }
 </script>
 
@@ -68,10 +85,12 @@
     />
   </Row>
 
-  <Row>
-    <Label>{browser.i18n.getMessage("bookmarksMenu") || "Bookmarks menu"}</Label>
-    <Checkbox bind:checked={bookmarksPermission} />
-  </Row>
+  {#if disableBookmarks === false}
+    <Row>
+      <Label>{browser.i18n.getMessage("bookmarksMenu") || "Bookmarks menu"}</Label>
+      <Checkbox bind:checked={bookmarksPermission} />
+    </Row>
+  {/if}
 
   <Exceptions />
 
diff --git a/src/pages/options_src/Services/Instances.svelte b/src/pages/options_src/Services/Instances.svelte
index 862bbf7e..3b870c4b 100644
--- a/src/pages/options_src/Services/Instances.svelte
+++ b/src/pages/options_src/Services/Instances.svelte
@@ -59,7 +59,6 @@
   async function pingInstances() {
     pingCache = {}
     for (const instance of allInstances) {
-      console.log("pinging...", instance)
       pingCache[instance] = { color: "lightblue", value: "pinging..." }
       const time = await utils.ping(instance)
       pingCache[instance] = colorTime(time)
diff --git a/src/pages/options_src/Services/Services.svelte b/src/pages/options_src/Services/Services.svelte
index 4e719447..b0f0d5e3 100644
--- a/src/pages/options_src/Services/Services.svelte
+++ b/src/pages/options_src/Services/Services.svelte
@@ -32,8 +32,9 @@
 <div>
   <Row>
     <Label>
-      Service:
-      <a href={serviceConf.url} target="_blank" rel="noopener noreferrer">{serviceConf.url}</a>
+      <a href={serviceConf.url} style="text-decoration: underline;" target="_blank" rel="noopener noreferrer">
+        {browser.i18n.getMessage("service") || "Service"}
+      </a>
     </Label>
     <div dir="ltr">
       <SvelteSelect
@@ -91,9 +92,8 @@
 
     <Row>
       <Label>
-        {browser.i18n.getMessage("frontend") || "Frontend"}:
-        <a href={frontendWebsite} target="_blank" rel="noopener noreferrer">
-          {frontendWebsite}
+        <a href={frontendWebsite} style="text-decoration: underline;" target="_blank" rel="noopener noreferrer">
+          {browser.i18n.getMessage("frontend") || "Frontend"}
         </a>
       </Label>
       <div dir="ltr">
diff --git a/src/pages/popup_src/Buttons.svelte b/src/pages/popup_src/Buttons.svelte
index bfa162f8..0b454675 100644
--- a/src/pages/popup_src/Buttons.svelte
+++ b/src/pages/popup_src/Buttons.svelte
@@ -41,7 +41,14 @@
 
 <div class={document.body.dir}>
   {#if redirect}
-    <Row class="interactive" on:click={() => browser.runtime.sendMessage("redirectTab")}>
+    <Row
+      class="interactive"
+      on:click={() => {
+        browser.runtime.sendMessage("redirectTab", () => {
+          window.close()
+        })
+      }}
+    >
       <Label>{browser.i18n.getMessage("redirect") || "Redirect"}</Label>
       <RedirectIcon />
     </Row>
@@ -50,7 +57,10 @@
   {#if switchInstance}
     <Row
       class="interactive"
-      on:click={async () => browser.tabs.update({ url: await servicesHelper.switchInstance(url) })}
+      on:click={async () =>
+        browser.tabs.update({ url: await servicesHelper.switchInstance(url) }, () => {
+          window.close()
+        })}
     >
       <Label>{browser.i18n.getMessage("switchInstance") || "Switch Instance"}</Label>
       <SwitchInstanceIcon />
@@ -62,7 +72,13 @@
       <Label>{browser.i18n.getMessage("copyOriginal") || "Copy Original"}</Label>
       <CopyIcon />
     </Row>
-    <Row class="interactive" on:click={() => browser.runtime.sendMessage("reverseTab")}>
+    <Row
+      class="interactive"
+      on:click={() =>
+        browser.runtime.sendMessage("reverseTab", () => {
+          window.close()
+        })}
+    >
       <Label>{browser.i18n.getMessage("redirectToOriginal" || "Redirect to Original")}</Label>
       <RedirectToOriginalIcon />
     </Row>
@@ -85,7 +101,13 @@
 
   <hr />
 
-  <Row class="interactive" on:click={() => window.open(browser.runtime.getURL("pages/options/index.html"), "_blank")}>
+  <Row
+    class="interactive"
+    on:click={() =>
+      browser.tabs.create({ url: browser.runtime.getURL("pages/options/index.html") }, () => {
+        window.close()
+      })}
+  >
     <Label>{browser.i18n.getMessage("settings")}</Label>
     <SettingsIcon />
   </Row>
diff --git a/src/pages/popup_src/components/Switch.svelte b/src/pages/popup_src/components/Switch.svelte
index e581e5f4..42a86403 100644
--- a/src/pages/popup_src/components/Switch.svelte
+++ b/src/pages/popup_src/components/Switch.svelte
@@ -28,7 +28,10 @@
   <div
     class="interactive"
     on:keydown={null}
-    on:click={() => window.open(browser.runtime.getURL(_config.services[serviceKey].url), "_blank")}
+    on:click={() =>
+      browser.tabs.create({ url: browser.runtime.getURL(_config.services[serviceKey].url) }, () => {
+        window.close()
+      })}
   >
     <ServiceIcon details={{ value: serviceKey, label: _config.services[serviceKey].name }} />
     <Label>{_config.services[serviceKey].name}</Label>
-- 
cgit 1.4.1


From e3517b107678ff1fd1fce3fd88da716516c0cf4e Mon Sep 17 00:00:00 2001
From: ManeraKai <manerakai@protonmail.com>
Date: Wed, 7 Aug 2024 18:32:57 +0300
Subject: Allowed switching service by hovering
 https://github.com/libredirect/browser_extension/issues/961

---
 src/pages/options_src/Services/Services.svelte | 11 +++++++++--
 1 file changed, 9 insertions(+), 2 deletions(-)

(limited to 'src/pages/options_src')

diff --git a/src/pages/options_src/Services/Services.svelte b/src/pages/options_src/Services/Services.svelte
index b0f0d5e3..16bf7b92 100644
--- a/src/pages/options_src/Services/Services.svelte
+++ b/src/pages/options_src/Services/Services.svelte
@@ -27,6 +27,8 @@
   $: serviceConf = _config.services[selectedService]
   $: serviceOptions = _options[selectedService]
   $: frontendWebsite = serviceConf.frontends[serviceOptions.frontend].url
+  $: servicesEntries = Object.entries(_config.services)
+  $: frontendEntries = Object.entries(serviceConf.frontends)
 </script>
 
 <div>
@@ -41,9 +43,10 @@
         clearable={false}
         class="svelte_select"
         value={selectedService}
+        on:hoverItem={e => (selectedService = servicesEntries[e.detail][0])}
         on:change={e => (selectedService = e.detail.value)}
         items={[
-          ...Object.entries(_config.services).map(([serviceKey, service]) => {
+          ...servicesEntries.map(([serviceKey, service]) => {
             return { value: serviceKey, label: service.name }
           }),
         ]}
@@ -102,12 +105,16 @@
           dir="ltr"
           class="svelte_select"
           value={serviceOptions.frontend}
+          on:hoverItem={e => {
+            serviceOptions.frontend = frontendEntries[e.detail][0]
+            options.set(_options)
+          }}
           on:change={e => {
             serviceOptions.frontend = e.detail.value
             options.set(_options)
           }}
           items={[
-            ...Object.entries(serviceConf.frontends).map(([frontendId, frontend]) => ({
+            ...frontendEntries.map(([frontendId, frontend]) => ({
               value: frontendId,
               label: frontend.name,
             })),
-- 
cgit 1.4.1


From feca205994a6d5def48233c115cd3d50f2568506 Mon Sep 17 00:00:00 2001
From: Monstorix <monstorix@outlook.com>
Date: Sat, 10 Aug 2024 21:47:55 +0800
Subject: Fix sidebar layouts and font fallbacks for CJK

---
 src/pages/options_src/App.svelte     | 2 +-
 src/pages/options_src/Sidebar.svelte | 3 ++-
 src/pages/popup_src/App.svelte       | 2 +-
 3 files changed, 4 insertions(+), 3 deletions(-)

(limited to 'src/pages/options_src')

diff --git a/src/pages/options_src/App.svelte b/src/pages/options_src/App.svelte
index dfafe1f0..b5a44856 100644
--- a/src/pages/options_src/App.svelte
+++ b/src/pages/options_src/App.svelte
@@ -110,7 +110,7 @@
     margin: 0;
     padding-top: 50px;
     justify-content: center;
-    font-family: "Inter";
+    font-family: "Inter", sans-serif;
     box-sizing: border-box;
     font-size: 16px;
     background-color: var(--bg-main);
diff --git a/src/pages/options_src/Sidebar.svelte b/src/pages/options_src/Sidebar.svelte
index 97780b15..5e2f4931 100644
--- a/src/pages/options_src/Sidebar.svelte
+++ b/src/pages/options_src/Sidebar.svelte
@@ -14,7 +14,7 @@
   </a>
   <a href="#services" on:click={() => page.set("services")} style={$page == "services" && "color: var(--active);"}>
     <ServicesIcon class="margin margin_{document.body.dir}" />
-    {browser.i18n.getMessage("general") || "Services"}
+    {browser.i18n.getMessage("services") || "Services"}
   </a>
   <a href="https://libredirect.github.io" target="_blank" rel="noopener noreferrer">
     <AboutIcon class="margin margin_{document.body.dir}" />
@@ -37,6 +37,7 @@
     color: var(--text);
     transition: 0.1s;
     margin: 10px;
+    min-width: max-content;
   }
 
   a:hover {
diff --git a/src/pages/popup_src/App.svelte b/src/pages/popup_src/App.svelte
index df37d55d..52aadc74 100644
--- a/src/pages/popup_src/App.svelte
+++ b/src/pages/popup_src/App.svelte
@@ -106,7 +106,7 @@
     margin: 0;
     padding: 10px;
     padding-top: 20px;
-    font-family: "Inter";
+    font-family: "Inter", sans-serif;
     font-size: 16px;
     background-color: var(--bg-main);
     color: var(--text);
-- 
cgit 1.4.1


From 3043541b5305ec0ed4fd01fa06da495f55c3053c Mon Sep 17 00:00:00 2001
From: ManeraKai <manerakai@protonmail.com>
Date: Thu, 15 Aug 2024 09:41:12 +0300
Subject: Removed select by hover
 https://github.com/libredirect/browser_extension/issues/961

---
 package.json                                       | 4 ++--
 src/pages/options_src/Services/FrontendIcon.svelte | 4 +---
 src/pages/options_src/Services/Services.svelte     | 5 -----
 3 files changed, 3 insertions(+), 10 deletions(-)

(limited to 'src/pages/options_src')

diff --git a/package.json b/package.json
index 9288b04b..7b9fbd11 100644
--- a/package.json
+++ b/package.json
@@ -8,8 +8,8 @@
   },
   "scripts": {
     "start": "web-ext run",
-    "nightly": "web-ext run --firefox=/home/esmail/software/firefox_nightly/firefox",
-    "start_ar": "web-ext run --firefox=/home/esmail/software/firefox_ar/firefox",
+    "firefox": "web-ext run --firefox=/home/manerakai/software/firefox/firefox",
+    "start_ar": "web-ext run --firefox=/home/manerakai/software/firefox_ar/firefox",
     "android": "web-ext run -t firefox-android --adb-device emulator-5554 --firefox-apk org.mozilla.firefox --adb-remove-old-artifacts",
     "build": "web-ext build -i pages/options_src -i pages/popup_src pages/icons -i pages/popup_src -i pages/components",
     "build_chromium": "brave-browser --pack-extension=src/ --pack-extension-key=src.pem",
diff --git a/src/pages/options_src/Services/FrontendIcon.svelte b/src/pages/options_src/Services/FrontendIcon.svelte
index 24942fd6..4b392676 100644
--- a/src/pages/options_src/Services/FrontendIcon.svelte
+++ b/src/pages/options_src/Services/FrontendIcon.svelte
@@ -1,6 +1,7 @@
 <script>
   import { onDestroy } from "svelte"
   export let details
+  export let selectedService
   import { config, options } from "../stores"
   let _options
   let _config
@@ -24,9 +25,6 @@
       theme = "light"
     }
   }
-
-  export let selectedService
-
   $: imageType = _config.services[selectedService].frontends[details.value].imageType
 </script>
 
diff --git a/src/pages/options_src/Services/Services.svelte b/src/pages/options_src/Services/Services.svelte
index 16bf7b92..a78ff0b6 100644
--- a/src/pages/options_src/Services/Services.svelte
+++ b/src/pages/options_src/Services/Services.svelte
@@ -43,7 +43,6 @@
         clearable={false}
         class="svelte_select"
         value={selectedService}
-        on:hoverItem={e => (selectedService = servicesEntries[e.detail][0])}
         on:change={e => (selectedService = e.detail.value)}
         items={[
           ...servicesEntries.map(([serviceKey, service]) => {
@@ -105,10 +104,6 @@
           dir="ltr"
           class="svelte_select"
           value={serviceOptions.frontend}
-          on:hoverItem={e => {
-            serviceOptions.frontend = frontendEntries[e.detail][0]
-            options.set(_options)
-          }}
           on:change={e => {
             serviceOptions.frontend = e.detail.value
             options.set(_options)
-- 
cgit 1.4.1


From ef9b247a916cb1e6fdaf275f0bcdfe7d104b1b2b Mon Sep 17 00:00:00 2001
From: ManeraKai <manerakai@protonmail.com>
Date: Fri, 16 Aug 2024 13:44:31 +0300
Subject: Faided disabled services
 https://github.com/libredirect/browser_extension/issues/961

---
 src/pages/options_src/Services/Services.svelte | 10 +++++++---
 1 file changed, 7 insertions(+), 3 deletions(-)

(limited to 'src/pages/options_src')

diff --git a/src/pages/options_src/Services/Services.svelte b/src/pages/options_src/Services/Services.svelte
index a78ff0b6..7c4a92b3 100644
--- a/src/pages/options_src/Services/Services.svelte
+++ b/src/pages/options_src/Services/Services.svelte
@@ -50,11 +50,11 @@
           }),
         ]}
       >
-        <div class="slot" slot="item" let:item>
+        <div class={"slot " + (!_options[item.value].enabled && "disabled")} slot="item" let:item>
           <ServiceIcon details={item} />
           {item.label}
         </div>
-        <div class="slot" slot="selection" let:selection>
+        <div class={"slot " + (!_options[selection.value].enabled && "disabled")} slot="selection" let:selection>
           <ServiceIcon details={selection} />
           {selection.label}
         </div>
@@ -181,10 +181,10 @@
     --width: 210px;
     --background: var(--bg-secondary);
     --list-background: var(--bg-secondary);
-    --item-active-background: red;
     --item-is-active-bg: grey;
     --item-hover-bg: grey;
     --item-is-active-color: var(--text);
+    --list-max-height: 400px;
     --padding: 0 0 0 10px;
     --item-color: var(--text);
   }
@@ -201,4 +201,8 @@
     width: 26px;
     color: var(--text);
   }
+
+  :global(.svelte_select .disabled) {
+    opacity: 0.4;
+  }
 </style>
-- 
cgit 1.4.1


From 6bd542f858ceaa392e11a526c713359d8f667399 Mon Sep 17 00:00:00 2001
From: ManeraKai <manerakai@protonmail.com>
Date: Fri, 16 Aug 2024 15:53:53 +0300
Subject: Added arrow icon to dropdowns. Added settings button to each service
 in the popup https://github.com/libredirect/browser_extension/issues/961

---
 src/pages/icons/SettingsIcon.svelte            |  3 ++
 src/pages/options_src/App.svelte               | 10 +++----
 src/pages/options_src/Services/Services.svelte | 13 +++++++--
 src/pages/options_src/Sidebar.svelte           |  6 ++--
 src/pages/options_src/stores.js                |  1 -
 src/pages/options_src/url.js                   | 38 ++++++++++++++++++++++++++
 src/pages/popup_src/App.svelte                 |  2 +-
 src/pages/popup_src/Buttons.svelte             |  4 +--
 src/pages/popup_src/components/Switch.svelte   |  8 ++++++
 9 files changed, 69 insertions(+), 16 deletions(-)
 create mode 100644 src/pages/options_src/url.js

(limited to 'src/pages/options_src')

diff --git a/src/pages/icons/SettingsIcon.svelte b/src/pages/icons/SettingsIcon.svelte
index f47d078a..00798289 100644
--- a/src/pages/icons/SettingsIcon.svelte
+++ b/src/pages/icons/SettingsIcon.svelte
@@ -1,10 +1,13 @@
 <svg
+  {...$$restProps}
   xmlns="http://www.w3.org/2000/svg"
   height="24px"
   width="24px"
   viewBox="0 0 24 24"
   preserveAspectRatio="xMinYMin meet"
   fill="currentColor"
+  on:click
+  on:keydown={null}
 >
   <path
     d="m9.25 22-.4-3.2q-.325-.125-.612-.3-.288-.175-.563-.375L4.7 19.375l-2.75-4.75 2.575-1.95Q4.5 12.5 4.5 12.337v-.675q0-.162.025-.337L1.95 9.375l2.75-4.75 2.975 1.25q.275-.2.575-.375.3-.175.6-.3l.4-3.2h5.5l.4 3.2q.325.125.613.3.287.175.562.375l2.975-1.25 2.75 4.75-2.575 1.95q.025.175.025.337v.675q0 .163-.05.338l2.575 1.95-2.75 4.75-2.95-1.25q-.275.2-.575.375-.3.175-.6.3l-.4 3.2Zm2.8-6.5q1.45 0 2.475-1.025Q15.55 13.45 15.55 12q0-1.45-1.025-2.475Q13.5 8.5 12.05 8.5q-1.475 0-2.488 1.025Q8.55 10.55 8.55 12q0 1.45 1.012 2.475Q10.575 15.5 12.05 15.5Z"
diff --git a/src/pages/options_src/App.svelte b/src/pages/options_src/App.svelte
index b5a44856..565aacef 100644
--- a/src/pages/options_src/App.svelte
+++ b/src/pages/options_src/App.svelte
@@ -2,12 +2,13 @@
   const browser = window.browser || window.chrome
 
   import General from "./General/General.svelte"
+  import url from './url'
   import utils from "../../assets/javascripts/utils.js"
   import { onDestroy } from "svelte"
   import servicesHelper from "../../assets/javascripts/services.js"
   import { onMount } from "svelte"
   import Sidebar from "./Sidebar.svelte"
-  import { options, config, page } from "./stores"
+  import { options, config } from "./stores"
   import Services from "./Services/Services.svelte"
 
   let _options
@@ -36,9 +37,6 @@
     config.set(await utils.getConfig())
   })
 
-  let _page
-  page.subscribe(val => (_page = val))
-
   const dark = {
     text: "#fff",
     bgMain: "#121212",
@@ -85,9 +83,9 @@
     --light-grey: {cssVariables.lightGrey};"
   >
     <Sidebar />
-    {#if _page == "general"}
+    {#if !$url.hash || $url.hash == "#general"}
       <General />
-    {:else if _page == "services"}
+    {:else if $url.hash.startsWith("#services")}
       <Services />
     {/if}
   </div>
diff --git a/src/pages/options_src/Services/Services.svelte b/src/pages/options_src/Services/Services.svelte
index 7c4a92b3..93afcded 100644
--- a/src/pages/options_src/Services/Services.svelte
+++ b/src/pages/options_src/Services/Services.svelte
@@ -1,6 +1,7 @@
 <script>
   const browser = window.browser || window.chrome
 
+  import url from "../url"
   import Row from "../../components/Row.svelte"
   import Label from "../../components/Label.svelte"
   import Select from "../../components/Select.svelte"
@@ -22,8 +23,7 @@
     unsubscribeOptions()
     unsubscribeConfig()
   })
-
-  let selectedService = "youtube"
+  let selectedService = $url.hash.startsWith("#services:") ? $url.hash.split(":")[1] : "youtube"
   $: serviceConf = _config.services[selectedService]
   $: serviceOptions = _options[selectedService]
   $: frontendWebsite = serviceConf.frontends[serviceOptions.frontend].url
@@ -43,7 +43,11 @@
         clearable={false}
         class="svelte_select"
         value={selectedService}
-        on:change={e => (selectedService = e.detail.value)}
+        showChevron
+        on:change={e => {
+          selectedService = e.detail.value
+          window.location.hash = `services:${e.detail.value}`
+        }}
         items={[
           ...servicesEntries.map(([serviceKey, service]) => {
             return { value: serviceKey, label: service.name }
@@ -58,6 +62,7 @@
           <ServiceIcon details={selection} />
           {selection.label}
         </div>
+        <div style="font-size: 10px;" slot="chevron-icon">🮦</div>
       </SvelteSelect>
     </div>
   </Row>
@@ -104,6 +109,7 @@
           dir="ltr"
           class="svelte_select"
           value={serviceOptions.frontend}
+          showChevron
           on:change={e => {
             serviceOptions.frontend = e.detail.value
             options.set(_options)
@@ -123,6 +129,7 @@
             <FrontendIcon details={selection} {selectedService} />
             {selection.label}
           </div>
+          <div style="font-size: 10px;" slot="chevron-icon">🮦</div>
         </SvelteSelect>
       </div>
     </Row>
diff --git a/src/pages/options_src/Sidebar.svelte b/src/pages/options_src/Sidebar.svelte
index 5e2f4931..6b67581a 100644
--- a/src/pages/options_src/Sidebar.svelte
+++ b/src/pages/options_src/Sidebar.svelte
@@ -1,18 +1,18 @@
 <script>
   const browser = window.browser || window.chrome
 
-  import { page } from "./stores"
+  import url from "./url"
   import GeneralIcon from "../icons/GeneralIcon.svelte"
   import ServicesIcon from "../icons/ServicesIcon.svelte"
   import AboutIcon from "../icons/AboutIcon.svelte"
 </script>
 
 <div>
-  <a href="#general" on:click={() => page.set("general")} style={$page == "general" && "color: var(--active);"}>
+  <a href="#general" style={$url.hash == "#general" && "color: var(--active);"}>
     <GeneralIcon class="margin margin_{document.body.dir}" />
     {browser.i18n.getMessage("general") || "General"}
   </a>
-  <a href="#services" on:click={() => page.set("services")} style={$page == "services" && "color: var(--active);"}>
+  <a href="#services" style={$url.hash == "#services" && "color: var(--active);"}>
     <ServicesIcon class="margin margin_{document.body.dir}" />
     {browser.i18n.getMessage("services") || "Services"}
   </a>
diff --git a/src/pages/options_src/stores.js b/src/pages/options_src/stores.js
index 782f6064..7ae0f8c7 100644
--- a/src/pages/options_src/stores.js
+++ b/src/pages/options_src/stores.js
@@ -2,4 +2,3 @@ import { writable } from "svelte/store"
 
 export const options = writable(null)
 export const config = writable(null)
-export const page = writable("general")
diff --git a/src/pages/options_src/url.js b/src/pages/options_src/url.js
new file mode 100644
index 00000000..010e5b21
--- /dev/null
+++ b/src/pages/options_src/url.js
@@ -0,0 +1,38 @@
+// https://svelte.dev/repl/5abaac000b164aa1aacc6051d5c4f584?version=3.59.2
+
+import { derived, writable } from 'svelte/store'
+
+export function createUrlStore(ssrUrl) {
+  // Ideally a bundler constant so that it's tree-shakable
+  if (typeof window === 'undefined') {
+    const { subscribe } = writable(ssrUrl)
+    return { subscribe }
+  }
+
+  const href = writable(window.location.href)
+
+  const originalPushState = history.pushState
+  const originalReplaceState = history.replaceState
+
+  const updateHref = () => href.set(window.location.href)
+
+  history.pushState = () => {
+    originalPushState.apply(this, arguments)
+    updateHref()
+  }
+
+  history.replaceState = () => {
+    originalReplaceState.apply(this, arguments)
+    updateHref()
+  }
+
+  window.addEventListener('popstate', updateHref)
+  window.addEventListener('hashchange', updateHref)
+
+  return {
+    subscribe: derived(href, ($href) => new URL($href)).subscribe
+  }
+}
+
+// If you're using in a pure SPA, you can return a store directly and share it everywhere
+export default createUrlStore()
diff --git a/src/pages/popup_src/App.svelte b/src/pages/popup_src/App.svelte
index 52aadc74..3409052d 100644
--- a/src/pages/popup_src/App.svelte
+++ b/src/pages/popup_src/App.svelte
@@ -88,7 +88,7 @@
 
 <style>
   :global(html, body) {
-    width: 250px;
+    width: 300px;
     height: min-content;
     min-height: auto;
     margin: 0;
diff --git a/src/pages/popup_src/Buttons.svelte b/src/pages/popup_src/Buttons.svelte
index 0b454675..e53a64b7 100644
--- a/src/pages/popup_src/Buttons.svelte
+++ b/src/pages/popup_src/Buttons.svelte
@@ -126,7 +126,7 @@
   }
 
   :global(img, svg) {
-    margin-right: 10px;
+    margin-right: 5px;
     margin-left: 0;
     height: 26px;
     width: 26px;
@@ -135,6 +135,6 @@
 
   :global(.rtl img, .rtl svg) {
     margin-right: 0;
-    margin-left: 10px;
+    margin-left: 5px;
   }
 </style>
diff --git a/src/pages/popup_src/components/Switch.svelte b/src/pages/popup_src/components/Switch.svelte
index f3df9317..6485f875 100644
--- a/src/pages/popup_src/components/Switch.svelte
+++ b/src/pages/popup_src/components/Switch.svelte
@@ -9,6 +9,7 @@
   import { onDestroy } from "svelte"
   import servicesHelper from "../../../assets/javascripts/services"
   import { options, config } from "../stores"
+  import SettingsIcon from "../../icons/SettingsIcon.svelte"
 
   let _options
   let _config
@@ -53,6 +54,13 @@
           window.close()
         })}
     />
+    <SettingsIcon
+      class="interactive"
+      on:click={() =>
+        browser.tabs.create({ url: browser.runtime.getURL(`pages/options/index.html#services:${serviceKey}`) }, () => {
+          window.close()
+        })}
+    />
   </div>
 </Row>
 
-- 
cgit 1.4.1


From f8af807d724e748efda71148e9a5733b36e453ee Mon Sep 17 00:00:00 2001
From: Monstorix <monstorix@outlook.com>
Date: Sat, 17 Aug 2024 17:41:03 +0800
Subject: Complete translation keys and fix Simplified Chinese translations

---
 src/_locales/ar/messages.json                      |  40 +++++-
 src/_locales/bn/messages.json                      | 146 +++++++++++++-------
 src/_locales/bs/messages.json                      |  48 ++++++-
 src/_locales/cs/messages.json                      |  39 +++++-
 src/_locales/de/messages.json                      |  39 +++++-
 src/_locales/delete.py                             |  18 ++-
 src/_locales/en/messages.json                      |  43 +++++-
 src/_locales/eo/messages.json                      | 146 +++++++++++++++++++-
 src/_locales/es/messages.json                      |  39 +++++-
 src/_locales/fi/messages.json                      | 153 +++++++++++++--------
 src/_locales/filter.py                             |   5 +
 src/_locales/fr/messages.json                      |  43 +++++-
 src/_locales/gl/messages.json                      |  39 +++++-
 src/_locales/hr/messages.json                      |  39 +++++-
 src/_locales/id/messages.json                      |  39 +++++-
 src/_locales/it/messages.json                      |  39 +++++-
 src/_locales/ja/messages.json                      |  39 +++++-
 src/_locales/jv/messages.json                      | 135 +++++++++++++++++-
 src/_locales/ko/messages.json                      |  46 ++++++-
 src/_locales/nb_NO/messages.json                   |  46 ++++++-
 src/_locales/nl/messages.json                      |  39 +++++-
 src/_locales/pl/messages.json                      |  39 +++++-
 src/_locales/pt/messages.json                      |  48 ++++++-
 src/_locales/pt_BR/messages.json                   |  45 +++++-
 src/_locales/ro/messages.json                      |  39 +++++-
 src/_locales/ru/messages.json                      |  39 +++++-
 src/_locales/sr/messages.json                      |  48 ++++++-
 src/_locales/tr/messages.json                      |  39 +++++-
 src/_locales/uk/messages.json                      |  39 +++++-
 src/_locales/vi/messages.json                      |  39 +++++-
 src/_locales/zh_Hans/messages.json                 |  47 ++++++-
 src/_locales/zh_Hant/messages.json                 |  86 +++++++++---
 src/pages/options_src/Services/RedirectType.svelte |   6 +-
 33 files changed, 1509 insertions(+), 225 deletions(-)

(limited to 'src/pages/options_src')

diff --git a/src/_locales/ar/messages.json b/src/_locales/ar/messages.json
index 516d07d2..10413b84 100644
--- a/src/_locales/ar/messages.json
+++ b/src/_locales/ar/messages.json
@@ -83,9 +83,8 @@
         "message": "أضف نظرائك المفضلين",
         "description": "used in the settings page"
     },
-    "copyRaw": {
-        "message": "الرابط الأصلي",
-        "description": "used in the popup"
+    "copyOriginal": {
+        "message": "Copy Original"
     },
     "copied": {
         "message": "تم النسخ",
@@ -110,5 +109,38 @@
     },
     "disable": {
         "message": "عطّل"
+    },
+    "pingInstances": {
+        "message": "Ping Instances"
+    },
+    "exportSettingsToSync": {
+        "message": "Export Settings to Sync"
+    },
+    "importSettingsFromSync": {
+        "message": "Import Settings from Sync"
+    },
+    "services": {
+        "message": "Services"
+    },
+    "service": {
+        "message": "Service"
+    },
+    "bookmarksMenu": {
+        "message": "Bookmarks menu"
+    },
+    "redirectOnlyInIncognito": {
+        "message": "Redirect Only in Incognito"
+    },
+    "bypass": {
+        "message": "Bypass"
+    },
+    "block": {
+        "message": "Block"
+    },
+    "searchHint": {
+        "message": "Set LibRedirect as Default Search Engine. For how to do in chromium browsers, click <a href='https://libredirect.github.io/docs.html#search_engine_chromium' target='_blank' rel='noopener noreferrer'>here</a>."
+    },
+    "redirect": {
+        "message": "Redirect"
     }
-}
+}
\ No newline at end of file
diff --git a/src/_locales/bn/messages.json b/src/_locales/bn/messages.json
index cdde0c45..60b91d65 100644
--- a/src/_locales/bn/messages.json
+++ b/src/_locales/bn/messages.json
@@ -1,22 +1,42 @@
 {
-    "dark": {
-        "message": "অন্ধকার",
+    "extensionName": {
+        "message": "লিবরিডাইরেক্ট",
+        "description": "name of the extension"
+    },
+    "extensionDescription": {
+        "message": "একটি ওয়েব এক্সটেনশন যা জনপ্রিয় সাইটগুলোকে বিকল্প গোপনীয়তা-বান্ধব ফ্রন্টএন্ড এবং ব্যাকএন্ডে পুনর্নির্দেশ করে",
+        "description": "description of the extension"
+    },
+    "switchInstance": {
+        "message": "ইন্সট্যান্স পাল্টাও",
+        "description": "used in manifest.json as shortcut description"
+    },
+    "settings": {
+        "message": "পছন্দসমূহ",
+        "description": "used in the popup"
+    },
+    "general": {
+        "message": "সাধারণ",
         "description": "used in the settings page"
     },
-    "auto": {
-        "message": "স্বয়ংক্রিয়",
+    "theme": {
+        "message": "রঙ",
         "description": "used in the settings page"
     },
-    "enable": {
-        "message": "সক্রিয়",
+    "light": {
+        "message": "সাদা",
         "description": "used in the settings page"
     },
-    "frontend": {
-        "message": "সামনের অংশ",
+    "dark": {
+        "message": "অন্ধকার",
         "description": "used in the settings page"
     },
-    "both": {
-        "message": "উভয়",
+    "auto": {
+        "message": "স্বয়ংক্রিয়",
+        "description": "used in the settings page"
+    },
+    "excludeFromRedirecting": {
+        "message": "পুনঃনির্দেশ থেকে বাদ দেওয়া",
         "description": "used in the settings page"
     },
     "importSettings": {
@@ -31,73 +51,95 @@
         "message": "পছন্দসমূহ সহজাত অবস্থায় ফিরত নাও",
         "description": "used in the settings page"
     },
+    "enable": {
+        "message": "সক্রিয়",
+        "description": "used in the settings page"
+    },
+    "showInPopup": {
+        "message": "পপআপে দেখাও",
+        "description": "used in the settings page"
+    },
+    "frontend": {
+        "message": "সামনের অংশ",
+        "description": "used in the settings page"
+    },
     "redirectType": {
         "message": "পুনঃনির্দেশ ধরণ",
         "description": "used in the settings page"
     },
-    "excludeFromRedirecting": {
-        "message": "পুনঃনির্দেশ থেকে বাদ দেওয়া",
+    "both": {
+        "message": "উভয়",
         "description": "used in the settings page"
     },
-    "showInPopup": {
-        "message": "পপআপে দেখাও",
+    "onlyEmbedded": {
+        "message": "শুধু এমবেডকৃত",
         "description": "used in the settings page"
     },
-    "copyRaw": {
-        "message": "কাঁচা অনুলিপি"
-    },
     "onlyNotEmbedded": {
         "message": "এমবেডকৃত নয়",
         "description": "used in the settings page"
     },
-    "about": {
-        "message": "আমাদের সম্পর্কে"
+    "addYourFavoriteInstances": {
+        "message": "পছন্দের ইন্সট্যান্স যোগ করো",
+        "description": "used in the settings page"
+    },
+    "copyOriginal": {
+        "message": "Copy Original"
+    },
+    "copied": {
+        "message": "অনুলিপিত"
+    },
+    "redirectToOriginal": {
+        "message": "আসলটায় পুনঃনির্দেশ করো",
+        "description": "Used in context menus when right clicking on a page/tab"
     },
     "redirectLink": {
         "message": "পুনঃনির্দেশ করার চেষ্টা করো",
         "description": "Used in context menus when right clicking on a hyperlink"
     },
-    "extensionName": {
-        "message": "লিবরিডাইরেক্ট",
-        "description": "name of the extension"
+    "about": {
+        "message": "আমাদের সম্পর্কে"
     },
-    "theme": {
-        "message": "রঙ",
-        "description": "used in the settings page"
+    "unsupportedIframesHandling": {
+        "message": "Unsupported embeds handling"
     },
-    "light": {
-        "message": "সাদা",
-        "description": "used in the settings page"
+    "fetchPublicInstances": {
+        "message": "Fetch public instances"
     },
-    "copied": {
-        "message": "অনুলিপিত"
+    "disable": {
+        "message": "Disable"
     },
-    "extensionDescription": {
-        "message": "একটি ওয়েব এক্সটেনশন যা জনপ্রিয় সাইটগুলোকে বিকল্প গোপনীয়তা-বান্ধব ফ্রন্টএন্ড এবং ব্যাকএন্ডে পুনর্নির্দেশ করে",
-        "description": "description of the extension"
+    "pingInstances": {
+        "message": "Ping Instances"
     },
-    "redirectToOriginal": {
-        "message": "আসলটায় পুনঃনির্দেশ করো",
-        "description": "Used in context menus when right clicking on a page/tab"
+    "exportSettingsToSync": {
+        "message": "Export Settings to Sync"
     },
-    "addYourFavoriteInstances": {
-        "message": "পছন্দের ইন্সট্যান্স যোগ করো",
-        "description": "used in the settings page"
+    "importSettingsFromSync": {
+        "message": "Import Settings from Sync"
     },
-    "settings": {
-        "message": "পছন্দসমূহ",
-        "description": "used in the popup"
+    "services": {
+        "message": "Services"
     },
-    "general": {
-        "message": "সাধারণ",
-        "description": "used in the settings page"
+    "service": {
+        "message": "Service"
     },
-    "switchInstance": {
-        "message": "ইন্সট্যান্স পাল্টাও",
-        "description": "used in manifest.json as shortcut description"
+    "bookmarksMenu": {
+        "message": "Bookmarks menu"
     },
-    "onlyEmbedded": {
-        "message": "শুধু এমবেডকৃত",
-        "description": "used in the settings page"
+    "redirectOnlyInIncognito": {
+        "message": "Redirect Only in Incognito"
+    },
+    "bypass": {
+        "message": "Bypass"
+    },
+    "block": {
+        "message": "Block"
+    },
+    "searchHint": {
+        "message": "Set LibRedirect as Default Search Engine. For how to do in chromium browsers, click <a href='https://libredirect.github.io/docs.html#search_engine_chromium' target='_blank' rel='noopener noreferrer'>here</a>."
+    },
+    "redirect": {
+        "message": "Redirect"
     }
-}
+}
\ No newline at end of file
diff --git a/src/_locales/bs/messages.json b/src/_locales/bs/messages.json
index 06c50c34..3f3039b6 100644
--- a/src/_locales/bs/messages.json
+++ b/src/_locales/bs/messages.json
@@ -83,8 +83,8 @@
         "message": "Dodajte vaše omiljene instance",
         "description": "used in the settings page"
     },
-    "copyRaw": {
-        "message": "Kopirajte neobrađenu kodu"
+    "copyOriginal": {
+        "message": "Copy Original"
     },
     "copied": {
         "message": "Kopirano"
@@ -99,5 +99,47 @@
     },
     "about": {
         "message": "O"
+    },
+    "unsupportedIframesHandling": {
+        "message": "Unsupported iframes handling"
+    },
+    "fetchPublicInstances": {
+        "message": "Fetch public instances"
+    },
+    "disable": {
+        "message": "Disable"
+    },
+    "pingInstances": {
+        "message": "Ping Instances"
+    },
+    "exportSettingsToSync": {
+        "message": "Export Settings to Sync"
+    },
+    "importSettingsFromSync": {
+        "message": "Import Settings from Sync"
+    },
+    "services": {
+        "message": "Services"
+    },
+    "service": {
+        "message": "Service"
+    },
+    "bookmarksMenu": {
+        "message": "Bookmarks menu"
+    },
+    "redirectOnlyInIncognito": {
+        "message": "Redirect Only in Incognito"
+    },
+    "bypass": {
+        "message": "Bypass"
+    },
+    "block": {
+        "message": "Block"
+    },
+    "searchHint": {
+        "message": "Set LibRedirect as Default Search Engine. For how to do in chromium browsers, click <a href='https://libredirect.github.io/docs.html#search_engine_chromium' target='_blank' rel='noopener noreferrer'>here</a>."
+    },
+    "redirect": {
+        "message": "Redirect"
     }
-}
+}
\ No newline at end of file
diff --git a/src/_locales/cs/messages.json b/src/_locales/cs/messages.json
index 245eb285..3ae7d793 100644
--- a/src/_locales/cs/messages.json
+++ b/src/_locales/cs/messages.json
@@ -83,8 +83,8 @@
         "message": "Přidejte své oblíbené instance",
         "description": "used in the settings page"
     },
-    "copyRaw": {
-        "message": "Zkopírovat surové"
+    "copyOriginal": {
+        "message": "Copy Original"
     },
     "copied": {
         "message": "Zkopírováno"
@@ -108,5 +108,38 @@
     },
     "disable": {
         "message": "Zakázat"
+    },
+    "pingInstances": {
+        "message": "Ping Instances"
+    },
+    "exportSettingsToSync": {
+        "message": "Export Settings to Sync"
+    },
+    "importSettingsFromSync": {
+        "message": "Import Settings from Sync"
+    },
+    "services": {
+        "message": "Services"
+    },
+    "service": {
+        "message": "Service"
+    },
+    "bookmarksMenu": {
+        "message": "Bookmarks menu"
+    },
+    "redirectOnlyInIncognito": {
+        "message": "Redirect Only in Incognito"
+    },
+    "bypass": {
+        "message": "Bypass"
+    },
+    "block": {
+        "message": "Block"
+    },
+    "searchHint": {
+        "message": "Set LibRedirect as Default Search Engine. For how to do in chromium browsers, click <a href='https://libredirect.github.io/docs.html#search_engine_chromium' target='_blank' rel='noopener noreferrer'>here</a>."
+    },
+    "redirect": {
+        "message": "Redirect"
     }
-}
+}
\ No newline at end of file
diff --git a/src/_locales/de/messages.json b/src/_locales/de/messages.json
index dbd4b53c..f7f58875 100644
--- a/src/_locales/de/messages.json
+++ b/src/_locales/de/messages.json
@@ -83,8 +83,8 @@
         "message": "Eigene Instanz hinzufügen",
         "description": "used in the settings page"
     },
-    "copyRaw": {
-        "message": "Original-Link kopieren"
+    "copyOriginal": {
+        "message": "Copy Original"
     },
     "copied": {
         "message": "Kopiert"
@@ -108,5 +108,38 @@
     },
     "disable": {
         "message": "Deaktivieren"
+    },
+    "pingInstances": {
+        "message": "Ping Instances"
+    },
+    "exportSettingsToSync": {
+        "message": "Export Settings to Sync"
+    },
+    "importSettingsFromSync": {
+        "message": "Import Settings from Sync"
+    },
+    "services": {
+        "message": "Services"
+    },
+    "service": {
+        "message": "Service"
+    },
+    "bookmarksMenu": {
+        "message": "Bookmarks menu"
+    },
+    "redirectOnlyInIncognito": {
+        "message": "Redirect Only in Incognito"
+    },
+    "bypass": {
+        "message": "Bypass"
+    },
+    "block": {
+        "message": "Block"
+    },
+    "searchHint": {
+        "message": "Set LibRedirect as Default Search Engine. For how to do in chromium browsers, click <a href='https://libredirect.github.io/docs.html#search_engine_chromium' target='_blank' rel='noopener noreferrer'>here</a>."
+    },
+    "redirect": {
+        "message": "Redirect"
     }
-}
+}
\ No newline at end of file
diff --git a/src/_locales/delete.py b/src/_locales/delete.py
index 13bfe546..486ab76f 100644
--- a/src/_locales/delete.py
+++ b/src/_locales/delete.py
@@ -11,15 +11,21 @@ with open('./en/messages.json') as data:
 keys = ['extensionName',
         'extensionDescription',
         'general',
+        'services',
+        'service',
         'theme',
         'auto',
         'light',
         'dark',
         'excludeFromRedirecting',
+        'fetchPublicInstances',
         'importSettings',
         'exportSettings',
+        'exportSettingsToSync',
+        'importSettingsFromSync',
         'resetSettings',
         'enable',
+        'disable',
         'showInPopup',
         'frontend',
         'redirectType',
@@ -28,12 +34,22 @@ keys = ['extensionName',
         'onlyNotEmbedded',
         'addYourFavoriteInstances',
         'switchInstance',
-        'copyRaw',
+        'copyOriginal',
         'copied',
         'settings',
         'about',
         'redirectToOriginal',
         'redirectLink',
+        'redirectOnlyInIncognito',
+        'bookmarksMenu',
+        'showInPopup',
+        'unsupportedIframesHandling',
+        'bypass',
+        'block',
+        'searchHint',
+        'excludeFromRedirecting',
+        'pingInstances',
+        'redirect',
         ]
 
 tmp = {}
diff --git a/src/_locales/en/messages.json b/src/_locales/en/messages.json
index 251bbebe..32f4b706 100644
--- a/src/_locales/en/messages.json
+++ b/src/_locales/en/messages.json
@@ -83,8 +83,8 @@
         "message": "Add your favorite instances",
         "description": "used in the settings page"
     },
-    "copyRaw": {
-        "message": "Copy Raw"
+    "copyOriginal": {
+        "message": "Copy Original"
     },
     "copied": {
         "message": "Copied"
@@ -101,12 +101,45 @@
         "message": "About"
     },
     "unsupportedIframesHandling": {
-        "message": "Unsupported iframes handling"
+        "message": "Unsupported embeds handling"
     },
     "fetchPublicInstances": {
         "message": "Fetch public instances"
     },
     "disable": {
         "message": "Disable"
-    }   
-}
\ No newline at end of file
+    },
+    "pingInstances": {
+        "message": "Ping Instances"
+    },
+    "exportSettingsToSync": {
+        "message": "Export Settings to Sync"
+    },
+    "importSettingsFromSync": {
+        "message": "Import Settings from Sync"
+    },
+    "services": {
+        "message": "Services"
+    },
+    "service": {
+        "message": "Service"
+    },
+    "bookmarksMenu": {
+        "message": "Bookmarks menu"
+    },
+    "redirectOnlyInIncognito": {
+        "message": "Redirect Only in Incognito"
+    },
+    "bypass": {
+        "message": "Bypass"
+    },
+    "block": {
+        "message": "Block"
+    },
+    "searchHint": {
+        "message": "Set LibRedirect as Default Search Engine. For how to do in chromium browsers, click <a href='https://libredirect.github.io/docs.html#search_engine_chromium' target='_blank' rel='noopener noreferrer'>here</a>."
+    },
+    "redirect": {
+        "message": "Redirect"
+    }
+}
diff --git a/src/_locales/eo/messages.json b/src/_locales/eo/messages.json
index 0967ef42..885c7802 100644
--- a/src/_locales/eo/messages.json
+++ b/src/_locales/eo/messages.json
@@ -1 +1,145 @@
-{}
+{
+    "extensionName": {
+        "message": "LibRedirect",
+        "description": "name of the extension"
+    },
+    "extensionDescription": {
+        "message": "A web extension that redirects popular sites to alternative privacy-friendly frontends and backends",
+        "description": "description of the extension"
+    },
+    "switchInstance": {
+        "message": "Switch Instance",
+        "description": "used in manifest.json as shortcut description"
+    },
+    "settings": {
+        "message": "Settings",
+        "description": "used in the popup"
+    },
+    "general": {
+        "message": "General",
+        "description": "used in the settings page"
+    },
+    "theme": {
+        "message": "Theme",
+        "description": "used in the settings page"
+    },
+    "light": {
+        "message": "Light",
+        "description": "used in the settings page"
+    },
+    "dark": {
+        "message": "Dark",
+        "description": "used in the settings page"
+    },
+    "auto": {
+        "message": "Auto",
+        "description": "used in the settings page"
+    },
+    "excludeFromRedirecting": {
+        "message": "Excluded from redirecting",
+        "description": "used in the settings page"
+    },
+    "importSettings": {
+        "message": "Import Settings",
+        "description": "used in the settings page"
+    },
+    "exportSettings": {
+        "message": "Export Settings",
+        "description": "used in the settings page"
+    },
+    "resetSettings": {
+        "message": "Reset Settings",
+        "description": "used in the settings page"
+    },
+    "enable": {
+        "message": "Enable",
+        "description": "used in the settings page"
+    },
+    "showInPopup": {
+        "message": "Show in popup",
+        "description": "used in the settings page"
+    },
+    "frontend": {
+        "message": "Frontend",
+        "description": "used in the settings page"
+    },
+    "redirectType": {
+        "message": "Redirect Type",
+        "description": "used in the settings page"
+    },
+    "both": {
+        "message": "both",
+        "description": "used in the settings page"
+    },
+    "onlyEmbedded": {
+        "message": "only embedded",
+        "description": "used in the settings page"
+    },
+    "onlyNotEmbedded": {
+        "message": "only not embedded",
+        "description": "used in the settings page"
+    },
+    "addYourFavoriteInstances": {
+        "message": "Add your favorite instances",
+        "description": "used in the settings page"
+    },
+    "copyOriginal": {
+        "message": "Copy Original"
+    },
+    "copied": {
+        "message": "Copied"
+    },
+    "redirectToOriginal": {
+        "message": "Redirect to original",
+        "description": "Used in context menus when right clicking on a page/tab"
+    },
+    "redirectLink": {
+        "message": "Attempt to redirect",
+        "description": "Used in context menus when right clicking on a hyperlink"
+    },
+    "about": {
+        "message": "About"
+    },
+    "unsupportedIframesHandling": {
+        "message": "Unsupported embeds handling"
+    },
+    "fetchPublicInstances": {
+        "message": "Fetch public instances"
+    },
+    "disable": {
+        "message": "Disable"
+    },
+    "pingInstances": {
+        "message": "Ping Instances"
+    },
+    "exportSettingsToSync": {
+        "message": "Export Settings to Sync"
+    },
+    "importSettingsFromSync": {
+        "message": "Import Settings from Sync"
+    },
+    "services": {
+        "message": "Services"
+    },
+    "service": {
+        "message": "Service"
+    },
+    "bookmarksMenu": {
+        "message": "Bookmarks menu"
+    },
+    "redirectOnlyInIncognito": {
+        "message": "Redirect Only in Incognito"
+    },
+    "bypass": {
+        "message": "Bypass"
+    },
+    "block": {
+        "message": "Block"
+    },
+    "searchHint": {
+        "message": "Set LibRedirect as Default Search Engine. For how to do in chromium browsers, click <a href='https://libredirect.github.io/docs.html#search_engine_chromium' target='_blank' rel='noopener noreferrer'>here</a>."
+    },
+    "redirect": {
+        "message": "Redirect"
+    }
+}
\ No newline at end of file
diff --git a/src/_locales/es/messages.json b/src/_locales/es/messages.json
index 8ebe7844..71b01de4 100644
--- a/src/_locales/es/messages.json
+++ b/src/_locales/es/messages.json
@@ -83,8 +83,8 @@
         "message": "Añade tus instancias preferidas",
         "description": "used in the settings page"
     },
-    "copyRaw": {
-        "message": "Copiar Original"
+    "copyOriginal": {
+        "message": "Copy Original"
     },
     "copied": {
         "message": "Copiado"
@@ -108,5 +108,38 @@
     },
     "disable": {
         "message": "Desactivar"
+    },
+    "pingInstances": {
+        "message": "Ping Instances"
+    },
+    "exportSettingsToSync": {
+        "message": "Export Settings to Sync"
+    },
+    "importSettingsFromSync": {
+        "message": "Import Settings from Sync"
+    },
+    "services": {
+        "message": "Services"
+    },
+    "service": {
+        "message": "Service"
+    },
+    "bookmarksMenu": {
+        "message": "Bookmarks menu"
+    },
+    "redirectOnlyInIncognito": {
+        "message": "Redirect Only in Incognito"
+    },
+    "bypass": {
+        "message": "Bypass"
+    },
+    "block": {
+        "message": "Block"
+    },
+    "searchHint": {
+        "message": "Set LibRedirect as Default Search Engine. For how to do in chromium browsers, click <a href='https://libredirect.github.io/docs.html#search_engine_chromium' target='_blank' rel='noopener noreferrer'>here</a>."
+    },
+    "redirect": {
+        "message": "Redirect"
     }
-}
+}
\ No newline at end of file
diff --git a/src/_locales/fi/messages.json b/src/_locales/fi/messages.json
index 0b6b797b..7e88f79c 100644
--- a/src/_locales/fi/messages.json
+++ b/src/_locales/fi/messages.json
@@ -1,21 +1,43 @@
 {
-    "excludeFromRedirecting": {
-        "message": "Poissuljettu uudelleenohjaukselta",
-        "description": "used in the settings page"
-    },
-    "copyRaw": {
-        "message": "Kopioi alkuperäinen"
+    "extensionName": {
+        "message": "LibRedirect",
+        "description": "name of the extension"
     },
-    "both": {
-        "message": "molemmat",
-        "description": "used in the settings page"
+    "extensionDescription": {
+        "message": "Selainlaajennus joka uudelleenohjaa suositut sivustot vaihtoehtoisiin yksityisyysystävällisiin käyttöliittymiin",
+        "description": "description of the extension"
     },
     "switchInstance": {
         "message": "Vaihda instanssi",
         "description": "used in manifest.json as shortcut description"
     },
-    "unsupportedIframesHandling": {
-        "message": "Tukemattomien iframejen käsittely"
+    "settings": {
+        "message": "Asetukset",
+        "description": "used in the popup"
+    },
+    "general": {
+        "message": "Yleiset",
+        "description": "used in the settings page"
+    },
+    "theme": {
+        "message": "Teema",
+        "description": "used in the settings page"
+    },
+    "light": {
+        "message": "Vaalea",
+        "description": "used in the settings page"
+    },
+    "dark": {
+        "message": "Tumma",
+        "description": "used in the settings page"
+    },
+    "auto": {
+        "message": "Automaattinen",
+        "description": "used in the settings page"
+    },
+    "excludeFromRedirecting": {
+        "message": "Poissuljettu uudelleenohjaukselta",
+        "description": "used in the settings page"
     },
     "importSettings": {
         "message": "Tuo asetukset",
@@ -25,88 +47,99 @@
         "message": "Vie asetukset",
         "description": "used in the settings page"
     },
-    "fetchPublicInstances": {
-        "message": "Hae julkiset instanssit"
-    },
-    "addYourFavoriteInstances": {
-        "message": "Lisää suosikki-instanssisi",
+    "resetSettings": {
+        "message": "Nollaa asetukset",
         "description": "used in the settings page"
     },
-    "extensionName": {
-        "message": "LibRedirect",
-        "description": "name of the extension"
+    "enable": {
+        "message": "Ota käyttöön",
+        "description": "used in the settings page"
     },
     "showInPopup": {
         "message": "Näytä ponnahdusvalikossa",
         "description": "used in the settings page"
     },
-    "theme": {
-        "message": "Teema",
+    "frontend": {
+        "message": "Käyttöliittymä",
+        "description": "used in the settings page"
+    },
+    "redirectType": {
+        "message": "Uudelleenohjauksen tyyppi",
+        "description": "used in the settings page"
+    },
+    "both": {
+        "message": "molemmat",
         "description": "used in the settings page"
     },
     "onlyEmbedded": {
         "message": "vain upotteet",
         "description": "used in the settings page"
     },
-    "light": {
-        "message": "Vaalea",
+    "onlyNotEmbedded": {
+        "message": "vain muut kuin upotteet",
         "description": "used in the settings page"
     },
-    "frontend": {
-        "message": "Käyttöliittymä",
+    "addYourFavoriteInstances": {
+        "message": "Lisää suosikki-instanssisi",
         "description": "used in the settings page"
     },
-    "extensionDescription": {
-        "message": "Selainlaajennus joka uudelleenohjaa suositut sivustot vaihtoehtoisiin yksityisyysystävällisiin käyttöliittymiin",
-        "description": "description of the extension"
+    "copyOriginal": {
+        "message": "Copy Original"
     },
     "copied": {
         "message": "Kopioitu"
     },
-    "onlyNotEmbedded": {
-        "message": "vain muut kuin upotteet",
-        "description": "used in the settings page"
-    },
-    "about": {
-        "message": "Tietoja"
+    "redirectToOriginal": {
+        "message": "Uudelleenohjaa alkuperäiseen",
+        "description": "Used in context menus when right clicking on a page/tab"
     },
     "redirectLink": {
         "message": "Yritä uudelleenohjata",
         "description": "Used in context menus when right clicking on a hyperlink"
     },
-    "redirectType": {
-        "message": "Uudelleenohjauksen tyyppi",
-        "description": "used in the settings page"
-    },
-    "dark": {
-        "message": "Tumma",
-        "description": "used in the settings page"
+    "about": {
+        "message": "Tietoja"
     },
-    "general": {
-        "message": "Yleiset",
-        "description": "used in the settings page"
+    "unsupportedIframesHandling": {
+        "message": "Tukemattomien iframejen käsittely"
     },
-    "enable": {
-        "message": "Ota käyttöön",
-        "description": "used in the settings page"
+    "fetchPublicInstances": {
+        "message": "Hae julkiset instanssit"
     },
     "disable": {
         "message": "Poista käytöstä"
     },
-    "redirectToOriginal": {
-        "message": "Uudelleenohjaa alkuperäiseen",
-        "description": "Used in context menus when right clicking on a page/tab"
+    "pingInstances": {
+        "message": "Ping Instances"
     },
-    "auto": {
-        "message": "Automaattinen",
-        "description": "used in the settings page"
+    "exportSettingsToSync": {
+        "message": "Export Settings to Sync"
     },
-    "settings": {
-        "message": "Asetukset",
-        "description": "used in the popup"
+    "importSettingsFromSync": {
+        "message": "Import Settings from Sync"
     },
-    "resetSettings": {
-        "message": "Nollaa asetukset",
-        "description": "used in the settings page"
+    "services": {
+        "message": "Services"
+    },
+    "service": {
+        "message": "Service"
+    },
+    "bookmarksMenu": {
+        "message": "Bookmarks menu"
+    },
+    "redirectOnlyInIncognito": {
+        "message": "Redirect Only in Incognito"
+    },
+    "bypass": {
+        "message": "Bypass"
+    },
+    "block": {
+        "message": "Block"
+    },
+    "searchHint": {
+        "message": "Set LibRedirect as Default Search Engine. For how to do in chromium browsers, click <a href='https://libredirect.github.io/docs.html#search_engine_chromium' target='_blank' rel='noopener noreferrer'>here</a>."
+    },
+    "redirect": {
+        "message": "Redirect"
     }
-}
+}
\ No newline at end of file
diff --git a/src/_locales/filter.py b/src/_locales/filter.py
index c60a6a4b..f9f03a1d 100644
--- a/src/_locales/filter.py
+++ b/src/_locales/filter.py
@@ -3,16 +3,20 @@ import json
 
 langs = [
     'ar',
+    'bn',
     'bs',
     'cs',
     'de',
+    'eo',
     'es',
+    'fi',
     'fr',
     'gl',
     'hr',
     'id',
     'it',
     'ja',
+    'jv',
     'ko',
     'nb_NO',
     'nl',
@@ -26,6 +30,7 @@ langs = [
     'uk',
     'vi',
     'zh_Hans',
+    'zh_Hant',
 ]
 en_json = {}
 
diff --git a/src/_locales/fr/messages.json b/src/_locales/fr/messages.json
index b24f6fcc..03fbc927 100644
--- a/src/_locales/fr/messages.json
+++ b/src/_locales/fr/messages.json
@@ -83,8 +83,8 @@
         "message": "Ajoutez vos instances favorites",
         "description": "used in the settings page"
     },
-    "copyRaw": {
-        "message": "Copier le lien original"
+    "copyOriginal": {
+        "message": "Copy Original"
     },
     "copied": {
         "message": "Copié"
@@ -100,13 +100,46 @@
     "about": {
         "message": "À propos"
     },
+    "unsupportedIframesHandling": {
+        "message": "Gestion des iframes non prises en charge"
+    },
     "fetchPublicInstances": {
         "message": "Rechercher des instances publiques"
     },
     "disable": {
         "message": "Désactiver"
     },
-    "unsupportedIframesHandling": {
-        "message": "Gestion des iframes non prises en charge"
+    "pingInstances": {
+        "message": "Ping Instances"
+    },
+    "exportSettingsToSync": {
+        "message": "Export Settings to Sync"
+    },
+    "importSettingsFromSync": {
+        "message": "Import Settings from Sync"
+    },
+    "services": {
+        "message": "Services"
+    },
+    "service": {
+        "message": "Service"
+    },
+    "bookmarksMenu": {
+        "message": "Bookmarks menu"
+    },
+    "redirectOnlyInIncognito": {
+        "message": "Redirect Only in Incognito"
+    },
+    "bypass": {
+        "message": "Bypass"
+    },
+    "block": {
+        "message": "Block"
+    },
+    "searchHint": {
+        "message": "Set LibRedirect as Default Search Engine. For how to do in chromium browsers, click <a href='https://libredirect.github.io/docs.html#search_engine_chromium' target='_blank' rel='noopener noreferrer'>here</a>."
+    },
+    "redirect": {
+        "message": "Redirect"
     }
-}
+}
\ No newline at end of file
diff --git a/src/_locales/gl/messages.json b/src/_locales/gl/messages.json
index 0df4ab9d..7ea16955 100644
--- a/src/_locales/gl/messages.json
+++ b/src/_locales/gl/messages.json
@@ -83,8 +83,8 @@
         "message": "Engade as túas instancias favoritas",
         "description": "used in the settings page"
     },
-    "copyRaw": {
-        "message": "Copiar Orixinal"
+    "copyOriginal": {
+        "message": "Copy Original"
     },
     "copied": {
         "message": "Copiouse"
@@ -108,5 +108,38 @@
     },
     "disable": {
         "message": "Desactivar"
+    },
+    "pingInstances": {
+        "message": "Ping Instances"
+    },
+    "exportSettingsToSync": {
+        "message": "Export Settings to Sync"
+    },
+    "importSettingsFromSync": {
+        "message": "Import Settings from Sync"
+    },
+    "services": {
+        "message": "Services"
+    },
+    "service": {
+        "message": "Service"
+    },
+    "bookmarksMenu": {
+        "message": "Bookmarks menu"
+    },
+    "redirectOnlyInIncognito": {
+        "message": "Redirect Only in Incognito"
+    },
+    "bypass": {
+        "message": "Bypass"
+    },
+    "block": {
+        "message": "Block"
+    },
+    "searchHint": {
+        "message": "Set LibRedirect as Default Search Engine. For how to do in chromium browsers, click <a href='https://libredirect.github.io/docs.html#search_engine_chromium' target='_blank' rel='noopener noreferrer'>here</a>."
+    },
+    "redirect": {
+        "message": "Redirect"
     }
-}
+}
\ No newline at end of file
diff --git a/src/_locales/hr/messages.json b/src/_locales/hr/messages.json
index 838a2af0..25c738c8 100644
--- a/src/_locales/hr/messages.json
+++ b/src/_locales/hr/messages.json
@@ -83,8 +83,8 @@
         "message": "Dodajte svoje omiljene instance",
         "description": "used in the settings page"
     },
-    "copyRaw": {
-        "message": "Kopiraj original"
+    "copyOriginal": {
+        "message": "Copy Original"
     },
     "copied": {
         "message": "Kopirano"
@@ -108,5 +108,38 @@
     },
     "disable": {
         "message": "Deaktiviraj"
+    },
+    "pingInstances": {
+        "message": "Ping Instances"
+    },
+    "exportSettingsToSync": {
+        "message": "Export Settings to Sync"
+    },
+    "importSettingsFromSync": {
+        "message": "Import Settings from Sync"
+    },
+    "services": {
+        "message": "Services"
+    },
+    "service": {
+        "message": "Service"
+    },
+    "bookmarksMenu": {
+        "message": "Bookmarks menu"
+    },
+    "redirectOnlyInIncognito": {
+        "message": "Redirect Only in Incognito"
+    },
+    "bypass": {
+        "message": "Bypass"
+    },
+    "block": {
+        "message": "Block"
+    },
+    "searchHint": {
+        "message": "Set LibRedirect as Default Search Engine. For how to do in chromium browsers, click <a href='https://libredirect.github.io/docs.html#search_engine_chromium' target='_blank' rel='noopener noreferrer'>here</a>."
+    },
+    "redirect": {
+        "message": "Redirect"
     }
-}
+}
\ No newline at end of file
diff --git a/src/_locales/id/messages.json b/src/_locales/id/messages.json
index 8db8ba91..c78c9b39 100644
--- a/src/_locales/id/messages.json
+++ b/src/_locales/id/messages.json
@@ -83,8 +83,8 @@
         "message": "Tambahkan server favorit Anda",
         "description": "used in the settings page"
     },
-    "copyRaw": {
-        "message": "Salin Mentah"
+    "copyOriginal": {
+        "message": "Copy Original"
     },
     "copied": {
         "message": "Disalin"
@@ -108,5 +108,38 @@
     },
     "disable": {
         "message": "Nonaktifkan"
+    },
+    "pingInstances": {
+        "message": "Ping Instances"
+    },
+    "exportSettingsToSync": {
+        "message": "Export Settings to Sync"
+    },
+    "importSettingsFromSync": {
+        "message": "Import Settings from Sync"
+    },
+    "services": {
+        "message": "Services"
+    },
+    "service": {
+        "message": "Service"
+    },
+    "bookmarksMenu": {
+        "message": "Bookmarks menu"
+    },
+    "redirectOnlyInIncognito": {
+        "message": "Redirect Only in Incognito"
+    },
+    "bypass": {
+        "message": "Bypass"
+    },
+    "block": {
+        "message": "Block"
+    },
+    "searchHint": {
+        "message": "Set LibRedirect as Default Search Engine. For how to do in chromium browsers, click <a href='https://libredirect.github.io/docs.html#search_engine_chromium' target='_blank' rel='noopener noreferrer'>here</a>."
+    },
+    "redirect": {
+        "message": "Redirect"
     }
-}
+}
\ No newline at end of file
diff --git a/src/_locales/it/messages.json b/src/_locales/it/messages.json
index 3507fe28..0ad02c44 100644
--- a/src/_locales/it/messages.json
+++ b/src/_locales/it/messages.json
@@ -83,8 +83,8 @@
         "message": "Aggiungi le tue istanze preferite",
         "description": "used in the settings page"
     },
-    "copyRaw": {
-        "message": "Copia grezza"
+    "copyOriginal": {
+        "message": "Copy Original"
     },
     "copied": {
         "message": "Copiato"
@@ -108,5 +108,38 @@
     },
     "disable": {
         "message": "Disattiva"
+    },
+    "pingInstances": {
+        "message": "Ping Instances"
+    },
+    "exportSettingsToSync": {
+        "message": "Export Settings to Sync"
+    },
+    "importSettingsFromSync": {
+        "message": "Import Settings from Sync"
+    },
+    "services": {
+        "message": "Services"
+    },
+    "service": {
+        "message": "Service"
+    },
+    "bookmarksMenu": {
+        "message": "Bookmarks menu"
+    },
+    "redirectOnlyInIncognito": {
+        "message": "Redirect Only in Incognito"
+    },
+    "bypass": {
+        "message": "Bypass"
+    },
+    "block": {
+        "message": "Block"
+    },
+    "searchHint": {
+        "message": "Set LibRedirect as Default Search Engine. For how to do in chromium browsers, click <a href='https://libredirect.github.io/docs.html#search_engine_chromium' target='_blank' rel='noopener noreferrer'>here</a>."
+    },
+    "redirect": {
+        "message": "Redirect"
     }
-}
+}
\ No newline at end of file
diff --git a/src/_locales/ja/messages.json b/src/_locales/ja/messages.json
index 3c77cf98..7ee234ec 100644
--- a/src/_locales/ja/messages.json
+++ b/src/_locales/ja/messages.json
@@ -83,8 +83,8 @@
         "message": "好きなインスタンスを追加",
         "description": "used in the settings page"
     },
-    "copyRaw": {
-        "message": "元のURIをコピー"
+    "copyOriginal": {
+        "message": "Copy Original"
     },
     "copied": {
         "message": "コピーしました"
@@ -108,5 +108,38 @@
     },
     "disable": {
         "message": "無効"
+    },
+    "pingInstances": {
+        "message": "Ping Instances"
+    },
+    "exportSettingsToSync": {
+        "message": "Export Settings to Sync"
+    },
+    "importSettingsFromSync": {
+        "message": "Import Settings from Sync"
+    },
+    "services": {
+        "message": "Services"
+    },
+    "service": {
+        "message": "Service"
+    },
+    "bookmarksMenu": {
+        "message": "Bookmarks menu"
+    },
+    "redirectOnlyInIncognito": {
+        "message": "Redirect Only in Incognito"
+    },
+    "bypass": {
+        "message": "Bypass"
+    },
+    "block": {
+        "message": "Block"
+    },
+    "searchHint": {
+        "message": "Set LibRedirect as Default Search Engine. For how to do in chromium browsers, click <a href='https://libredirect.github.io/docs.html#search_engine_chromium' target='_blank' rel='noopener noreferrer'>here</a>."
+    },
+    "redirect": {
+        "message": "Redirect"
     }
-}
+}
\ No newline at end of file
diff --git a/src/_locales/jv/messages.json b/src/_locales/jv/messages.json
index 40fb052b..90a2fc45 100644
--- a/src/_locales/jv/messages.json
+++ b/src/_locales/jv/messages.json
@@ -1,4 +1,24 @@
 {
+    "extensionName": {
+        "message": "LibRedirect",
+        "description": "name of the extension"
+    },
+    "extensionDescription": {
+        "message": "A web extension that redirects popular sites to alternative privacy-friendly frontends and backends",
+        "description": "description of the extension"
+    },
+    "switchInstance": {
+        "message": "Switch Instance",
+        "description": "used in manifest.json as shortcut description"
+    },
+    "settings": {
+        "message": "Settings",
+        "description": "used in the popup"
+    },
+    "general": {
+        "message": "General",
+        "description": "used in the settings page"
+    },
     "theme": {
         "message": "Téma",
         "description": "used in the settings page"
@@ -11,8 +31,115 @@
         "message": "Peteng",
         "description": "used in the settings page"
     },
-    "extensionName": {
-        "message": "LibRedirect",
-        "description": "name of the extension"
+    "auto": {
+        "message": "Auto",
+        "description": "used in the settings page"
+    },
+    "excludeFromRedirecting": {
+        "message": "Excluded from redirecting",
+        "description": "used in the settings page"
+    },
+    "importSettings": {
+        "message": "Import Settings",
+        "description": "used in the settings page"
+    },
+    "exportSettings": {
+        "message": "Export Settings",
+        "description": "used in the settings page"
+    },
+    "resetSettings": {
+        "message": "Reset Settings",
+        "description": "used in the settings page"
+    },
+    "enable": {
+        "message": "Enable",
+        "description": "used in the settings page"
+    },
+    "showInPopup": {
+        "message": "Show in popup",
+        "description": "used in the settings page"
+    },
+    "frontend": {
+        "message": "Frontend",
+        "description": "used in the settings page"
+    },
+    "redirectType": {
+        "message": "Redirect Type",
+        "description": "used in the settings page"
+    },
+    "both": {
+        "message": "both",
+        "description": "used in the settings page"
+    },
+    "onlyEmbedded": {
+        "message": "only embedded",
+        "description": "used in the settings page"
+    },
+    "onlyNotEmbedded": {
+        "message": "only not embedded",
+        "description": "used in the settings page"
+    },
+    "addYourFavoriteInstances": {
+        "message": "Add your favorite instances",
+        "description": "used in the settings page"
+    },
+    "copyOriginal": {
+        "message": "Copy Original"
+    },
+    "copied": {
+        "message": "Copied"
+    },
+    "redirectToOriginal": {
+        "message": "Redirect to original",
+        "description": "Used in context menus when right clicking on a page/tab"
+    },
+    "redirectLink": {
+        "message": "Attempt to redirect",
+        "description": "Used in context menus when right clicking on a hyperlink"
+    },
+    "about": {
+        "message": "About"
+    },
+    "unsupportedIframesHandling": {
+        "message": "Unsupported embeds handling"
+    },
+    "fetchPublicInstances": {
+        "message": "Fetch public instances"
+    },
+    "disable": {
+        "message": "Disable"
+    },
+    "pingInstances": {
+        "message": "Ping Instances"
+    },
+    "exportSettingsToSync": {
+        "message": "Export Settings to Sync"
+    },
+    "importSettingsFromSync": {
+        "message": "Import Settings from Sync"
+    },
+    "services": {
+        "message": "Services"
+    },
+    "service": {
+        "message": "Service"
+    },
+    "bookmarksMenu": {
+        "message": "Bookmarks menu"
+    },
+    "redirectOnlyInIncognito": {
+        "message": "Redirect Only in Incognito"
+    },
+    "bypass": {
+        "message": "Bypass"
+    },
+    "block": {
+        "message": "Block"
+    },
+    "searchHint": {
+        "message": "Set LibRedirect as Default Search Engine. For how to do in chromium browsers, click <a href='https://libredirect.github.io/docs.html#search_engine_chromium' target='_blank' rel='noopener noreferrer'>here</a>."
+    },
+    "redirect": {
+        "message": "Redirect"
     }
-}
+}
\ No newline at end of file
diff --git a/src/_locales/ko/messages.json b/src/_locales/ko/messages.json
index 85b72c93..c9774988 100644
--- a/src/_locales/ko/messages.json
+++ b/src/_locales/ko/messages.json
@@ -83,8 +83,8 @@
         "message": "Add your favorite instances",
         "description": "used in the settings page"
     },
-    "copyRaw": {
-        "message": "Raw 복사"
+    "copyOriginal": {
+        "message": "Copy Original"
     },
     "copied": {
         "message": "복사됨"
@@ -99,5 +99,47 @@
     },
     "about": {
         "message": "About"
+    },
+    "unsupportedIframesHandling": {
+        "message": "Unsupported iframes handling"
+    },
+    "fetchPublicInstances": {
+        "message": "Fetch public instances"
+    },
+    "disable": {
+        "message": "Disable"
+    },
+    "pingInstances": {
+        "message": "Ping Instances"
+    },
+    "exportSettingsToSync": {
+        "message": "Export Settings to Sync"
+    },
+    "importSettingsFromSync": {
+        "message": "Import Settings from Sync"
+    },
+    "services": {
+        "message": "Services"
+    },
+    "service": {
+        "message": "Service"
+    },
+    "bookmarksMenu": {
+        "message": "Bookmarks menu"
+    },
+    "redirectOnlyInIncognito": {
+        "message": "Redirect Only in Incognito"
+    },
+    "bypass": {
+        "message": "Bypass"
+    },
+    "block": {
+        "message": "Block"
+    },
+    "searchHint": {
+        "message": "Set LibRedirect as Default Search Engine. For how to do in chromium browsers, click <a href='https://libredirect.github.io/docs.html#search_engine_chromium' target='_blank' rel='noopener noreferrer'>here</a>."
+    },
+    "redirect": {
+        "message": "Redirect"
     }
 }
\ No newline at end of file
diff --git a/src/_locales/nb_NO/messages.json b/src/_locales/nb_NO/messages.json
index 46860019..ac7accd4 100644
--- a/src/_locales/nb_NO/messages.json
+++ b/src/_locales/nb_NO/messages.json
@@ -83,8 +83,8 @@
         "message": "Add your favorite instances",
         "description": "used in the settings page"
     },
-    "copyRaw": {
-        "message": "Kopier originallenke"
+    "copyOriginal": {
+        "message": "Copy Original"
     },
     "copied": {
         "message": "Kopiert"
@@ -99,5 +99,47 @@
     },
     "about": {
         "message": "About"
+    },
+    "unsupportedIframesHandling": {
+        "message": "Unsupported iframes handling"
+    },
+    "fetchPublicInstances": {
+        "message": "Fetch public instances"
+    },
+    "disable": {
+        "message": "Disable"
+    },
+    "pingInstances": {
+        "message": "Ping Instances"
+    },
+    "exportSettingsToSync": {
+        "message": "Export Settings to Sync"
+    },
+    "importSettingsFromSync": {
+        "message": "Import Settings from Sync"
+    },
+    "services": {
+        "message": "Services"
+    },
+    "service": {
+        "message": "Service"
+    },
+    "bookmarksMenu": {
+        "message": "Bookmarks menu"
+    },
+    "redirectOnlyInIncognito": {
+        "message": "Redirect Only in Incognito"
+    },
+    "bypass": {
+        "message": "Bypass"
+    },
+    "block": {
+        "message": "Block"
+    },
+    "searchHint": {
+        "message": "Set LibRedirect as Default Search Engine. For how to do in chromium browsers, click <a href='https://libredirect.github.io/docs.html#search_engine_chromium' target='_blank' rel='noopener noreferrer'>here</a>."
+    },
+    "redirect": {
+        "message": "Redirect"
     }
 }
\ No newline at end of file
diff --git a/src/_locales/nl/messages.json b/src/_locales/nl/messages.json
index a4c6fbba..07dd6ec7 100644
--- a/src/_locales/nl/messages.json
+++ b/src/_locales/nl/messages.json
@@ -83,8 +83,8 @@
         "message": "Toevoegen aan favoriete instanties",
         "description": "used in the settings page"
     },
-    "copyRaw": {
-        "message": "Onbewerkte code kopiëren"
+    "copyOriginal": {
+        "message": "Copy Original"
     },
     "copied": {
         "message": "Gekopieerd"
@@ -108,5 +108,38 @@
     },
     "disable": {
         "message": "Uitschakelen"
+    },
+    "pingInstances": {
+        "message": "Ping Instances"
+    },
+    "exportSettingsToSync": {
+        "message": "Export Settings to Sync"
+    },
+    "importSettingsFromSync": {
+        "message": "Import Settings from Sync"
+    },
+    "services": {
+        "message": "Services"
+    },
+    "service": {
+        "message": "Service"
+    },
+    "bookmarksMenu": {
+        "message": "Bookmarks menu"
+    },
+    "redirectOnlyInIncognito": {
+        "message": "Redirect Only in Incognito"
+    },
+    "bypass": {
+        "message": "Bypass"
+    },
+    "block": {
+        "message": "Block"
+    },
+    "searchHint": {
+        "message": "Set LibRedirect as Default Search Engine. For how to do in chromium browsers, click <a href='https://libredirect.github.io/docs.html#search_engine_chromium' target='_blank' rel='noopener noreferrer'>here</a>."
+    },
+    "redirect": {
+        "message": "Redirect"
     }
-}
+}
\ No newline at end of file
diff --git a/src/_locales/pl/messages.json b/src/_locales/pl/messages.json
index d9cb8cde..818c1fb9 100644
--- a/src/_locales/pl/messages.json
+++ b/src/_locales/pl/messages.json
@@ -83,8 +83,8 @@
         "message": "Dodaj ulubione instancje",
         "description": "used in the settings page"
     },
-    "copyRaw": {
-        "message": "Skopiuj nieprzetworzony"
+    "copyOriginal": {
+        "message": "Copy Original"
     },
     "copied": {
         "message": "Skopiowano"
@@ -108,5 +108,38 @@
     },
     "disable": {
         "message": "Wyłącz"
+    },
+    "pingInstances": {
+        "message": "Ping Instances"
+    },
+    "exportSettingsToSync": {
+        "message": "Export Settings to Sync"
+    },
+    "importSettingsFromSync": {
+        "message": "Import Settings from Sync"
+    },
+    "services": {
+        "message": "Services"
+    },
+    "service": {
+        "message": "Service"
+    },
+    "bookmarksMenu": {
+        "message": "Bookmarks menu"
+    },
+    "redirectOnlyInIncognito": {
+        "message": "Redirect Only in Incognito"
+    },
+    "bypass": {
+        "message": "Bypass"
+    },
+    "block": {
+        "message": "Block"
+    },
+    "searchHint": {
+        "message": "Set LibRedirect as Default Search Engine. For how to do in chromium browsers, click <a href='https://libredirect.github.io/docs.html#search_engine_chromium' target='_blank' rel='noopener noreferrer'>here</a>."
+    },
+    "redirect": {
+        "message": "Redirect"
     }
-}
+}
\ No newline at end of file
diff --git a/src/_locales/pt/messages.json b/src/_locales/pt/messages.json
index 5340cb1b..a29c9a07 100644
--- a/src/_locales/pt/messages.json
+++ b/src/_locales/pt/messages.json
@@ -83,8 +83,8 @@
         "message": "Adicionar a sua instância favorita",
         "description": "used in the settings page"
     },
-    "copyRaw": {
-        "message": "Copiar URL original"
+    "copyOriginal": {
+        "message": "Copy Original"
     },
     "copied": {
         "message": "Copiado"
@@ -99,5 +99,47 @@
     },
     "about": {
         "message": "Sobre"
+    },
+    "unsupportedIframesHandling": {
+        "message": "Unsupported iframes handling"
+    },
+    "fetchPublicInstances": {
+        "message": "Fetch public instances"
+    },
+    "disable": {
+        "message": "Disable"
+    },
+    "pingInstances": {
+        "message": "Ping Instances"
+    },
+    "exportSettingsToSync": {
+        "message": "Export Settings to Sync"
+    },
+    "importSettingsFromSync": {
+        "message": "Import Settings from Sync"
+    },
+    "services": {
+        "message": "Services"
+    },
+    "service": {
+        "message": "Service"
+    },
+    "bookmarksMenu": {
+        "message": "Bookmarks menu"
+    },
+    "redirectOnlyInIncognito": {
+        "message": "Redirect Only in Incognito"
+    },
+    "bypass": {
+        "message": "Bypass"
+    },
+    "block": {
+        "message": "Block"
+    },
+    "searchHint": {
+        "message": "Set LibRedirect as Default Search Engine. For how to do in chromium browsers, click <a href='https://libredirect.github.io/docs.html#search_engine_chromium' target='_blank' rel='noopener noreferrer'>here</a>."
+    },
+    "redirect": {
+        "message": "Redirect"
     }
-}
+}
\ No newline at end of file
diff --git a/src/_locales/pt_BR/messages.json b/src/_locales/pt_BR/messages.json
index f0fc4e8a..2fd4383e 100644
--- a/src/_locales/pt_BR/messages.json
+++ b/src/_locales/pt_BR/messages.json
@@ -83,8 +83,8 @@
         "message": "Adicione sua instância favorita",
         "description": "used in the settings page"
     },
-    "copyRaw": {
-        "message": "Copiar URL original"
+    "copyOriginal": {
+        "message": "Copy Original"
     },
     "copied": {
         "message": "Copiado"
@@ -100,7 +100,46 @@
     "about": {
         "message": "Sobre"
     },
+    "unsupportedIframesHandling": {
+        "message": "Unsupported iframes handling"
+    },
+    "fetchPublicInstances": {
+        "message": "Fetch public instances"
+    },
     "disable": {
         "message": "Desativar"
+    },
+    "pingInstances": {
+        "message": "Ping Instances"
+    },
+    "exportSettingsToSync": {
+        "message": "Export Settings to Sync"
+    },
+    "importSettingsFromSync": {
+        "message": "Import Settings from Sync"
+    },
+    "services": {
+        "message": "Services"
+    },
+    "service": {
+        "message": "Service"
+    },
+    "bookmarksMenu": {
+        "message": "Bookmarks menu"
+    },
+    "redirectOnlyInIncognito": {
+        "message": "Redirect Only in Incognito"
+    },
+    "bypass": {
+        "message": "Bypass"
+    },
+    "block": {
+        "message": "Block"
+    },
+    "searchHint": {
+        "message": "Set LibRedirect as Default Search Engine. For how to do in chromium browsers, click <a href='https://libredirect.github.io/docs.html#search_engine_chromium' target='_blank' rel='noopener noreferrer'>here</a>."
+    },
+    "redirect": {
+        "message": "Redirect"
     }
-}
+}
\ No newline at end of file
diff --git a/src/_locales/ro/messages.json b/src/_locales/ro/messages.json
index 6c530d3b..1bf62182 100644
--- a/src/_locales/ro/messages.json
+++ b/src/_locales/ro/messages.json
@@ -83,8 +83,8 @@
         "message": "Add your favorite instances",
         "description": "used in the settings page"
     },
-    "copyRaw": {
-        "message": "Copiați Raw"
+    "copyOriginal": {
+        "message": "Copy Original"
     },
     "copied": {
         "message": "Copiat"
@@ -108,5 +108,38 @@
     },
     "disable": {
         "message": "Dezactivează"
+    },
+    "pingInstances": {
+        "message": "Ping Instances"
+    },
+    "exportSettingsToSync": {
+        "message": "Export Settings to Sync"
+    },
+    "importSettingsFromSync": {
+        "message": "Import Settings from Sync"
+    },
+    "services": {
+        "message": "Services"
+    },
+    "service": {
+        "message": "Service"
+    },
+    "bookmarksMenu": {
+        "message": "Bookmarks menu"
+    },
+    "redirectOnlyInIncognito": {
+        "message": "Redirect Only in Incognito"
+    },
+    "bypass": {
+        "message": "Bypass"
+    },
+    "block": {
+        "message": "Block"
+    },
+    "searchHint": {
+        "message": "Set LibRedirect as Default Search Engine. For how to do in chromium browsers, click <a href='https://libredirect.github.io/docs.html#search_engine_chromium' target='_blank' rel='noopener noreferrer'>here</a>."
+    },
+    "redirect": {
+        "message": "Redirect"
     }
-}
+}
\ No newline at end of file
diff --git a/src/_locales/ru/messages.json b/src/_locales/ru/messages.json
index a8920dd6..a958bb5d 100644
--- a/src/_locales/ru/messages.json
+++ b/src/_locales/ru/messages.json
@@ -83,8 +83,8 @@
         "message": "Добавить в избранное",
         "description": "used in the settings page"
     },
-    "copyRaw": {
-        "message": "Копировать изначальную"
+    "copyOriginal": {
+        "message": "Copy Original"
     },
     "copied": {
         "message": "Скопировано"
@@ -108,5 +108,38 @@
     },
     "disable": {
         "message": "Выключить"
+    },
+    "pingInstances": {
+        "message": "Ping Instances"
+    },
+    "exportSettingsToSync": {
+        "message": "Export Settings to Sync"
+    },
+    "importSettingsFromSync": {
+        "message": "Import Settings from Sync"
+    },
+    "services": {
+        "message": "Services"
+    },
+    "service": {
+        "message": "Service"
+    },
+    "bookmarksMenu": {
+        "message": "Bookmarks menu"
+    },
+    "redirectOnlyInIncognito": {
+        "message": "Redirect Only in Incognito"
+    },
+    "bypass": {
+        "message": "Bypass"
+    },
+    "block": {
+        "message": "Block"
+    },
+    "searchHint": {
+        "message": "Set LibRedirect as Default Search Engine. For how to do in chromium browsers, click <a href='https://libredirect.github.io/docs.html#search_engine_chromium' target='_blank' rel='noopener noreferrer'>here</a>."
+    },
+    "redirect": {
+        "message": "Redirect"
     }
-}
+}
\ No newline at end of file
diff --git a/src/_locales/sr/messages.json b/src/_locales/sr/messages.json
index b14cb2dc..e4a71835 100644
--- a/src/_locales/sr/messages.json
+++ b/src/_locales/sr/messages.json
@@ -83,8 +83,8 @@
         "message": "Додајте своје омиљене инстанце",
         "description": "used in the settings page"
     },
-    "copyRaw": {
-        "message": "Копирајте необрађену коду"
+    "copyOriginal": {
+        "message": "Copy Original"
     },
     "copied": {
         "message": "Копирано"
@@ -99,5 +99,47 @@
     },
     "about": {
         "message": "О"
+    },
+    "unsupportedIframesHandling": {
+        "message": "Unsupported iframes handling"
+    },
+    "fetchPublicInstances": {
+        "message": "Fetch public instances"
+    },
+    "disable": {
+        "message": "Disable"
+    },
+    "pingInstances": {
+        "message": "Ping Instances"
+    },
+    "exportSettingsToSync": {
+        "message": "Export Settings to Sync"
+    },
+    "importSettingsFromSync": {
+        "message": "Import Settings from Sync"
+    },
+    "services": {
+        "message": "Services"
+    },
+    "service": {
+        "message": "Service"
+    },
+    "bookmarksMenu": {
+        "message": "Bookmarks menu"
+    },
+    "redirectOnlyInIncognito": {
+        "message": "Redirect Only in Incognito"
+    },
+    "bypass": {
+        "message": "Bypass"
+    },
+    "block": {
+        "message": "Block"
+    },
+    "searchHint": {
+        "message": "Set LibRedirect as Default Search Engine. For how to do in chromium browsers, click <a href='https://libredirect.github.io/docs.html#search_engine_chromium' target='_blank' rel='noopener noreferrer'>here</a>."
+    },
+    "redirect": {
+        "message": "Redirect"
     }
-}
+}
\ No newline at end of file
diff --git a/src/_locales/tr/messages.json b/src/_locales/tr/messages.json
index e350a9fa..c77210c0 100644
--- a/src/_locales/tr/messages.json
+++ b/src/_locales/tr/messages.json
@@ -83,8 +83,8 @@
         "message": "Sevdiğiniz örnekleri ekleyin",
         "description": "used in the settings page"
     },
-    "copyRaw": {
-        "message": "Ham Kopyala"
+    "copyOriginal": {
+        "message": "Copy Original"
     },
     "copied": {
         "message": "Kopyalandı"
@@ -108,5 +108,38 @@
     },
     "disable": {
         "message": "Devre dışı bırak"
+    },
+    "pingInstances": {
+        "message": "Ping Instances"
+    },
+    "exportSettingsToSync": {
+        "message": "Export Settings to Sync"
+    },
+    "importSettingsFromSync": {
+        "message": "Import Settings from Sync"
+    },
+    "services": {
+        "message": "Services"
+    },
+    "service": {
+        "message": "Service"
+    },
+    "bookmarksMenu": {
+        "message": "Bookmarks menu"
+    },
+    "redirectOnlyInIncognito": {
+        "message": "Redirect Only in Incognito"
+    },
+    "bypass": {
+        "message": "Bypass"
+    },
+    "block": {
+        "message": "Block"
+    },
+    "searchHint": {
+        "message": "Set LibRedirect as Default Search Engine. For how to do in chromium browsers, click <a href='https://libredirect.github.io/docs.html#search_engine_chromium' target='_blank' rel='noopener noreferrer'>here</a>."
+    },
+    "redirect": {
+        "message": "Redirect"
     }
-}
+}
\ No newline at end of file
diff --git a/src/_locales/uk/messages.json b/src/_locales/uk/messages.json
index 0b3b7f0f..14763b6b 100644
--- a/src/_locales/uk/messages.json
+++ b/src/_locales/uk/messages.json
@@ -83,8 +83,8 @@
         "message": "Додати свої улюблені сервери",
         "description": "used in the settings page"
     },
-    "copyRaw": {
-        "message": "Копіювати оригінал посилання"
+    "copyOriginal": {
+        "message": "Copy Original"
     },
     "copied": {
         "message": "Скопійовано"
@@ -108,5 +108,38 @@
     },
     "disable": {
         "message": "Вимкнути"
+    },
+    "pingInstances": {
+        "message": "Ping Instances"
+    },
+    "exportSettingsToSync": {
+        "message": "Export Settings to Sync"
+    },
+    "importSettingsFromSync": {
+        "message": "Import Settings from Sync"
+    },
+    "services": {
+        "message": "Services"
+    },
+    "service": {
+        "message": "Service"
+    },
+    "bookmarksMenu": {
+        "message": "Bookmarks menu"
+    },
+    "redirectOnlyInIncognito": {
+        "message": "Redirect Only in Incognito"
+    },
+    "bypass": {
+        "message": "Bypass"
+    },
+    "block": {
+        "message": "Block"
+    },
+    "searchHint": {
+        "message": "Set LibRedirect as Default Search Engine. For how to do in chromium browsers, click <a href='https://libredirect.github.io/docs.html#search_engine_chromium' target='_blank' rel='noopener noreferrer'>here</a>."
+    },
+    "redirect": {
+        "message": "Redirect"
     }
-}
+}
\ No newline at end of file
diff --git a/src/_locales/vi/messages.json b/src/_locales/vi/messages.json
index dac9e4a7..1ad0a2e8 100644
--- a/src/_locales/vi/messages.json
+++ b/src/_locales/vi/messages.json
@@ -83,8 +83,8 @@
         "message": "Thêm những instance bạn yêu thích",
         "description": "used in the settings page"
     },
-    "copyRaw": {
-        "message": "Sao chép liên kết gốc"
+    "copyOriginal": {
+        "message": "Copy Original"
     },
     "copied": {
         "message": "Đã Sao Chép"
@@ -108,5 +108,38 @@
     },
     "disable": {
         "message": "Tắt"
+    },
+    "pingInstances": {
+        "message": "Ping Instances"
+    },
+    "exportSettingsToSync": {
+        "message": "Export Settings to Sync"
+    },
+    "importSettingsFromSync": {
+        "message": "Import Settings from Sync"
+    },
+    "services": {
+        "message": "Services"
+    },
+    "service": {
+        "message": "Service"
+    },
+    "bookmarksMenu": {
+        "message": "Bookmarks menu"
+    },
+    "redirectOnlyInIncognito": {
+        "message": "Redirect Only in Incognito"
+    },
+    "bypass": {
+        "message": "Bypass"
+    },
+    "block": {
+        "message": "Block"
+    },
+    "searchHint": {
+        "message": "Set LibRedirect as Default Search Engine. For how to do in chromium browsers, click <a href='https://libredirect.github.io/docs.html#search_engine_chromium' target='_blank' rel='noopener noreferrer'>here</a>."
+    },
+    "redirect": {
+        "message": "Redirect"
     }
-}
+}
\ No newline at end of file
diff --git a/src/_locales/zh_Hans/messages.json b/src/_locales/zh_Hans/messages.json
index 7cb1f511..0584edf0 100644
--- a/src/_locales/zh_Hans/messages.json
+++ b/src/_locales/zh_Hans/messages.json
@@ -56,7 +56,7 @@
         "description": "used in the settings page"
     },
     "showInPopup": {
-        "message": "显示于弹出窗口",
+        "message": "显示在弹窗中",
         "description": "used in the settings page"
     },
     "frontend": {
@@ -68,22 +68,22 @@
         "description": "used in the settings page"
     },
     "both": {
-        "message": "两者",
+        "message": "所有页面",
         "description": "used in the settings page"
     },
     "onlyEmbedded": {
-        "message": "仅当嵌入时",
+        "message": "仅嵌入页面",
         "description": "used in the settings page"
     },
     "onlyNotEmbedded": {
-        "message": "仅当非嵌入时",
+        "message": "仅常规页面",
         "description": "used in the settings page"
     },
     "addYourFavoriteInstances": {
         "message": "添加您喜欢的实例",
         "description": "used in the settings page"
     },
-    "copyRaw": {
+    "copyOriginal": {
         "message": "复制原始链接"
     },
     "copied": {
@@ -94,19 +94,52 @@
         "description": "Used in context menus when right clicking on a page/tab"
     },
     "redirectLink": {
-        "message": "尝试重定向",
+        "message": "尝试进行重定向",
         "description": "Used in context menus when right clicking on a hyperlink"
     },
     "about": {
         "message": "关于"
     },
     "unsupportedIframesHandling": {
-        "message": "对不支持的 iframe 的处理方式"
+        "message": "处理未支持的嵌入页面的方式"
     },
     "fetchPublicInstances": {
         "message": "获取公共实例"
     },
     "disable": {
         "message": "禁用"
+    },
+    "pingInstances": {
+        "message": "对实例进行测速"
+    },
+    "exportSettingsToSync": {
+        "message": "导出设置到同步服务"
+    },
+    "importSettingsFromSync": {
+        "message": "从同步服务导入设置"
+    },
+    "services": {
+        "message": "服务"
+    },
+    "service": {
+        "message": "服务"
+    },
+    "bookmarksMenu": {
+        "message": "书签菜单"
+    },
+    "redirectOnlyInIncognito": {
+        "message": "仅在隐私模式下重定向"
+    },
+    "bypass": {
+        "message": "绕过"
+    },
+    "block": {
+        "message": "屏蔽"
+    },
+    "searchHint": {
+        "message": "请将 LibRedirect 设为默认搜索引擎。对于 Chromium 的操作方法，点击<a href='https://libredirect.github.io/docs.html#search_engine_chromium' target='_blank' rel='noopener noreferrer'>此处</a>了解。"
+    },
+    "redirect": {
+        "message": "重定向"
     }
 }
diff --git a/src/_locales/zh_Hant/messages.json b/src/_locales/zh_Hant/messages.json
index 86675479..12218d75 100644
--- a/src/_locales/zh_Hant/messages.json
+++ b/src/_locales/zh_Hant/messages.json
@@ -1,15 +1,12 @@
 {
-    "both": {
-        "message": "全部",
-        "description": "used in the settings page"
-    },
-    "copied": {
-        "message": "已複製"
-    },
     "extensionName": {
         "message": "LibRedirect",
         "description": "name of the extension"
     },
+    "extensionDescription": {
+        "message": "WebExtension 擴充套件，可將熱門網站重新導向至隱私友好的替代服務",
+        "description": "description of the extension"
+    },
     "switchInstance": {
         "message": "切換執行個體",
         "description": "used in manifest.json as shortcut description"
@@ -18,10 +15,6 @@
         "message": "設定",
         "description": "used in the popup"
     },
-    "extensionDescription": {
-        "message": "WebExtension 擴充套件，可將熱門網站重新導向至隱私友好的替代服務",
-        "description": "description of the extension"
-    },
     "general": {
         "message": "一般",
         "description": "used in the settings page"
@@ -42,14 +35,14 @@
         "message": "自動",
         "description": "used in the settings page"
     },
-    "importSettings": {
-        "message": "匯入設定",
-        "description": "used in the settings page"
-    },
     "excludeFromRedirecting": {
         "message": "不作重新導向",
         "description": "used in the settings page"
     },
+    "importSettings": {
+        "message": "匯入設定",
+        "description": "used in the settings page"
+    },
     "exportSettings": {
         "message": "匯出設定",
         "description": "used in the settings page"
@@ -74,6 +67,14 @@
         "message": "重新導向類型",
         "description": "used in the settings page"
     },
+    "both": {
+        "message": "全部",
+        "description": "used in the settings page"
+    },
+    "onlyEmbedded": {
+        "message": "僅內嵌",
+        "description": "used in the settings page"
+    },
     "onlyNotEmbedded": {
         "message": "非內嵌",
         "description": "used in the settings page"
@@ -82,6 +83,12 @@
         "message": "新增常用執行個體",
         "description": "used in the settings page"
     },
+    "copyOriginal": {
+        "message": "Copy Original"
+    },
+    "copied": {
+        "message": "已複製"
+    },
     "redirectToOriginal": {
         "message": "重新導向到原網址",
         "description": "Used in context menus when right clicking on a page/tab"
@@ -90,14 +97,49 @@
         "message": "嘗試重新導向",
         "description": "Used in context menus when right clicking on a hyperlink"
     },
-    "copyRaw": {
-        "message": "複製原始網址"
-    },
     "about": {
         "message": "關於"
     },
-    "onlyEmbedded": {
-        "message": "僅內嵌",
-        "description": "used in the settings page"
+    "unsupportedIframesHandling": {
+        "message": "Unsupported iframes handling"
+    },
+    "fetchPublicInstances": {
+        "message": "Fetch public instances"
+    },
+    "disable": {
+        "message": "Disable"
+    },
+    "pingInstances": {
+        "message": "Ping Instances"
+    },
+    "exportSettingsToSync": {
+        "message": "Export Settings to Sync"
+    },
+    "importSettingsFromSync": {
+        "message": "Import Settings from Sync"
+    },
+    "services": {
+        "message": "Services"
+    },
+    "service": {
+        "message": "Service"
+    },
+    "bookmarksMenu": {
+        "message": "Bookmarks menu"
+    },
+    "redirectOnlyInIncognito": {
+        "message": "Redirect Only in Incognito"
+    },
+    "bypass": {
+        "message": "Bypass"
+    },
+    "block": {
+        "message": "Block"
+    },
+    "searchHint": {
+        "message": "Set LibRedirect as Default Search Engine. For how to do in chromium browsers, click <a href='https://libredirect.github.io/docs.html#search_engine_chromium' target='_blank' rel='noopener noreferrer'>here</a>."
+    },
+    "redirect": {
+        "message": "Redirect"
     }
-}
+}
\ No newline at end of file
diff --git a/src/pages/options_src/Services/RedirectType.svelte b/src/pages/options_src/Services/RedirectType.svelte
index 29c169bc..69ea2b73 100644
--- a/src/pages/options_src/Services/RedirectType.svelte
+++ b/src/pages/options_src/Services/RedirectType.svelte
@@ -37,15 +37,15 @@
     Object.values(serviceConf.frontends).some(frontend => frontend.embeddable)
   ) {
     values = [
-      { value: "both", name: "both" },
-      { value: "main_frame", name: "Only Not Embedded" },
+      { value: "both", name: browser.i18n.getMessage("both") || "Both" },
+      { value: "main_frame", name: browser.i18n.getMessage("onlyNotEmbedded") || "Only Not Embedded" },
     ]
     if (serviceOptions.redirectType == "sub_frame") {
       serviceOptions.redirectType = "main_frame"
       options.set(_options)
     }
   } else {
-    values = [{ value: "main_frame", name: "Only Not Embedded" }]
+    values = [{ value: "main_frame", name: browser.i18n.getMessage("onlyNotEmbedded") || "Only Not Embedded" }]
     serviceOptions.redirectType = "main_frame"
     options.set(_options)
   }
-- 
cgit 1.4.1


From 7c9a23503783a6397b628541b50e3081901cd96f Mon Sep 17 00:00:00 2001
From: ManeraKai <manerakai@protonmail.com>
Date: Sat, 17 Aug 2024 21:59:56 +0300
Subject: Added Dropdown is searchable hint
 https://github.com/libredirect/browser_extension/issues/961

---
 src/pages/options_src/Services/Services.svelte | 34 ++++++++++++++++++++------
 1 file changed, 27 insertions(+), 7 deletions(-)

(limited to 'src/pages/options_src')

diff --git a/src/pages/options_src/Services/Services.svelte b/src/pages/options_src/Services/Services.svelte
index 93afcded..481afb83 100644
--- a/src/pages/options_src/Services/Services.svelte
+++ b/src/pages/options_src/Services/Services.svelte
@@ -24,6 +24,8 @@
     unsubscribeConfig()
   })
   let selectedService = $url.hash.startsWith("#services:") ? $url.hash.split(":")[1] : "youtube"
+  let hideServiceSelection = false
+  let hideFrontendSelection = false
   $: serviceConf = _config.services[selectedService]
   $: serviceOptions = _options[selectedService]
   $: frontendWebsite = serviceConf.frontends[serviceOptions.frontend].url
@@ -38,7 +40,7 @@
         {browser.i18n.getMessage("service") || "Service"}
       </a>
     </Label>
-    <div dir="ltr">
+    <div dir="ltr" on:click={() => (hideServiceSelection = true)} on:keydown={null}>
       <SvelteSelect
         clearable={false}
         class="svelte_select"
@@ -47,7 +49,10 @@
         on:change={e => {
           selectedService = e.detail.value
           window.location.hash = `services:${e.detail.value}`
+          hideServiceSelection = false
         }}
+        on:focus={() => (hideServiceSelection = true)}
+        on:blur={() => (hideServiceSelection = false)}
         items={[
           ...servicesEntries.map(([serviceKey, service]) => {
             return { value: serviceKey, label: service.name }
@@ -58,9 +63,17 @@
           <ServiceIcon details={item} />
           {item.label}
         </div>
-        <div class={"slot " + (!_options[selection.value].enabled && "disabled")} slot="selection" let:selection>
-          <ServiceIcon details={selection} />
-          {selection.label}
+        <div
+          class={"slot " + (!_options[selection.value].enabled && !hideServiceSelection && "disabled")}
+          slot="selection"
+          let:selection
+        >
+          {#if !hideServiceSelection}
+            <ServiceIcon details={selection} />
+            {selection.label}
+          {:else}
+            {browser.i18n.getMessage("search_service") || "Search Service"}
+          {/if}
         </div>
         <div style="font-size: 10px;" slot="chevron-icon">🮦</div>
       </SvelteSelect>
@@ -103,7 +116,7 @@
           {browser.i18n.getMessage("frontend") || "Frontend"}
         </a>
       </Label>
-      <div dir="ltr">
+      <div dir="ltr"  on:click={() => (hideFrontendSelection = true)} on:keydown={null}>
         <SvelteSelect
           clearable={false}
           dir="ltr"
@@ -113,7 +126,10 @@
           on:change={e => {
             serviceOptions.frontend = e.detail.value
             options.set(_options)
+            hideFrontendSelection = false
           }}
+          on:focus={() => (hideFrontendSelection = true)}
+          on:blur={() => (hideFrontendSelection = false)}
           items={[
             ...frontendEntries.map(([frontendId, frontend]) => ({
               value: frontendId,
@@ -126,8 +142,12 @@
             {item.label}
           </div>
           <div class="slot" slot="selection" let:selection>
-            <FrontendIcon details={selection} {selectedService} />
-            {selection.label}
+            {#if !hideFrontendSelection}
+              <FrontendIcon details={selection} {selectedService} />
+              {selection.label}
+            {:else}
+              {browser.i18n.getMessage("search_frontend") || "Search Frontend"}
+            {/if}
           </div>
           <div style="font-size: 10px;" slot="chevron-icon">🮦</div>
         </SvelteSelect>
-- 
cgit 1.4.1


From a94ad51a346d58f090e4d9a26fe5e78f15474acd Mon Sep 17 00:00:00 2001
From: ManeraKai <manerakai@protonmail.com>
Date: Sun, 18 Aug 2024 13:00:57 +0300
Subject: Allowing to import from previous version
 https://github.com/libredirect/browser_extension/issues/961

---
 src/assets/javascripts/services.js                 | 134 +++++++++------------
 src/pages/background/background.js                 |   8 +-
 .../options_src/General/SettingsButtons.svelte     |  28 ++---
 src/pages/options_src/Services/Services.svelte     |   2 +-
 src/pages/popup_src/App.svelte                     |   2 +-
 5 files changed, 76 insertions(+), 98 deletions(-)

(limited to 'src/pages/options_src')

diff --git a/src/assets/javascripts/services.js b/src/assets/javascripts/services.js
index 417f66c3..9b6ef325 100644
--- a/src/assets/javascripts/services.js
+++ b/src/assets/javascripts/services.js
@@ -831,99 +831,86 @@ const defaultInstances = {
   ytify: ["https://ytify.netlify.app"],
 }
 
+async function getDefaults() {
+  let config = await utils.getConfig()
+  let options = {}
+  for (const service in config.services) {
+    options[service] = {}
+    for (const defaultOption in config.services[service].options) {
+      options[service][defaultOption] = config.services[service].options[defaultOption]
+    }
+    for (const frontend in config.services[service].frontends) {
+      if (config.services[service].frontends[frontend].instanceList) {
+        options[frontend] = []
+      }
+    }
+  }
+  options.exceptions = {
+    url: [],
+    regex: [],
+  }
+  options.theme = "detect"
+  options.popupServices = ["youtube", "tiktok", "imgur", "reddit", "quora", "translate", "maps"]
+  options.fetchInstances = "github"
+  options.redirectOnlyInIncognito = false
+  options = { ...options, ...defaultInstances }
+  return options
+}
+
 function initDefaults() {
   return new Promise(resolve => {
     browser.storage.local.clear(async () => {
-      let config = await utils.getConfig()
-      let options = {}
-      for (const service in config.services) {
-        options[service] = {}
-        for (const defaultOption in config.services[service].options) {
-          options[service][defaultOption] = config.services[service].options[defaultOption]
-        }
-        for (const frontend in config.services[service].frontends) {
-          if (config.services[service].frontends[frontend].instanceList) {
-            options[frontend] = []
-          }
-        }
-      }
-      options.exceptions = {
-        url: [],
-        regex: [],
-      }
-      options.theme = "detect"
-      options.popupServices = ["youtube", "tiktok", "imgur", "reddit", "quora", "translate", "maps"]
-      options.fetchInstances = "github"
-      options.redirectOnlyInIncognito = false
-
-      options = { ...options, ...defaultInstances }
-
+      options = await getDefaults()
       browser.storage.local.set({ options }, () => resolve())
     })
   })
 }
 
-function upgradeOptions() {
-  return new Promise(async resolve => {
-    let options = await utils.getOptions()
-
-    browser.storage.local.clear(() => {
-      browser.storage.local.set({ options }, () => {
-        resolve()
-      })
-    })
-  })
-}
-
-function processUpdate() {
+function processUpdate(_options) {
   return new Promise(async resolve => {
-    let frontends = []
     const config = await utils.getConfig()
-    let options = await utils.getOptions()
-    for (const service in config.services) {
-      if (!options[service]) options[service] = {}
+    let options = _options ?? await utils.getOptions()
 
-      if (!(options[service].frontend in config.services[service].frontends)) {
-        options[service] = config.services[service].options // Reset settings for service
-        delete options[options[service].frontend] // Remove deprecated frontend
-      }
+    const defaults = await getDefaults()
 
-      for (const defaultOption in config.services[service].options) {
-        if (!(defaultOption in options[service])) {
-          options[service][defaultOption] = config.services[service].options[defaultOption]
+    // Remove any unknown option or subOption
+    for (const optionName in options) {
+      if (!(optionName in defaults)) delete options[optionName]
+      else if (typeof optionName === 'object' && optionName !== null) {
+        for (const subOptionName in options[optionName]) {
+          if (!(subOptionName in defaults[optionName])) delete options[optionName][subOptionName]
         }
       }
+    }
+
+    // Remove any unknwon popupService
+    options.popupServices = options.popupServices.filter(service => service in config.services)
+
+    // Add missing options
+    for (const [defaultName, defaultValue] of Object.entries(defaults)) {
+      if (!(defaultName in options)) {
+        options[defaultName] = defaultValue
+      }
+    }
 
-      for (const frontend in config.services[service].frontends) {
-        frontends.push(frontend)
-        if (!(frontend in options) && config.services[service].frontends[frontend].instanceList) {
-          options[frontend] = defaultInstances[frontend] || []
-        }
+    for (const [serviceName, serviceValue] of Object.entries(config.services)) {
+      // Reset service options if selected frontend is deprecated
+      if (!(options[serviceName].frontend in serviceValue.frontends)) {
+        options[serviceName] = serviceValue.options
       }
 
-      for (const frontend of options.popupServices) {
-        if (!Object.keys(config.services).includes(frontend)) {
-          const i = options.popupServices.indexOf(frontend)
-          if (i > -1) options.popupServices.splice(i, 1)
+      // Add a default service option if it's not present
+      for (const optionName in serviceValue.options) {
+        if (!(optionName in options[serviceName])) {
+          options[serviceName][optionName] = serviceValue.options[optionName]
         }
       }
     }
-    const general = ["theme", "popupServices", "fetchInstances", "redirectOnlyInIncognito"]
-    const combined = [
-      ...Object.keys(config.services),
-      ...frontends,
-      ...general,
-      "exceptions",
-      "popupServices",
-      "version",
-    ]
-    for (const key in options) {
-      if (combined.indexOf(key) < 0) {
-        delete options[key] // Remove any unknown settings in options
-      }
-    }
-    browser.storage.local.set({ options }, () => {
-      resolve()
+
+    browser.storage.local.clear(() => {
+      browser.storage.local.set({ options }, () => {
+        resolve(options)
+      })
     })
   })
 }
@@ -973,7 +960,6 @@ export default {
   computeService,
   reverse,
   initDefaults,
-  upgradeOptions,
   processUpdate,
   copyRaw,
   switchInstance,
diff --git a/src/pages/background/background.js b/src/pages/background/background.js
index d42e5027..576365bd 100644
--- a/src/pages/background/background.js
+++ b/src/pages/background/background.js
@@ -13,14 +13,8 @@ browser.runtime.onInstalled.addListener(async details => {
       if (!(await utils.getOptions())) {
         await servicesHelper.initDefaults()
       }
-      browser.runtime.openOptionsPage()
     } else if (details.reason == "update") {
-      if (details.previousVersion == "2.5.2") {
-        await servicesHelper.upgradeOptions()
-        await servicesHelper.processUpdate()
-      } else {
-        await servicesHelper.processUpdate()
-      }
+      await servicesHelper.processUpdate()
     }
   }
 })
diff --git a/src/pages/options_src/General/SettingsButtons.svelte b/src/pages/options_src/General/SettingsButtons.svelte
index 2f574199..29b756d2 100644
--- a/src/pages/options_src/General/SettingsButtons.svelte
+++ b/src/pages/options_src/General/SettingsButtons.svelte
@@ -20,14 +20,12 @@
     const reader = new FileReader()
     reader.readAsText(importSettingsFiles[0])
     reader.onload = async () => {
-      const data = JSON.parse(reader.result)
-      if ("theme" in data && data.version == browser.runtime.getManifest().version) {
-        browser.storage.local.clear(async () => {
-          options.set(data)
-        })
-      } else {
-        alert("Incompatible settings")
+      let data = JSON.parse(reader.result)
+      if (data.version != browser.runtime.getManifest().version) {
+        alert("Importing from a previous version. Be careful")
       }
+      data = await servicesHelper.processUpdate(data)
+      options.set(data)
     }
     reader.onerror = error => {
       console.log("error", error)
@@ -51,20 +49,20 @@
   }
 
   async function importSettingsSync() {
-    browser.storage.sync.get({ options }, r => {
-      const optionsSync = r.options
-      if (optionsSync.version == browser.runtime.getManifest().version) {
-        options.set(optionsSync)
-      } else {
-        alert("Error")
+    browser.storage.sync.get({ options }, async r => {
+      let data = r.options
+      if (data.version != browser.runtime.getManifest().version) {
+        alert("Importing from a previous version. Be careful")
       }
+      data = await servicesHelper.processUpdate(data)
+      options.set(data)
     })
   }
 
   async function resetSettings() {
     browser.storage.local.clear(async () => {
-      await servicesHelper.initDefaults()
-      options.set(await utils.getOptions())
+      const data = await servicesHelper.initDefaults()
+      options.set(data)
     })
   }
 </script>
diff --git a/src/pages/options_src/Services/Services.svelte b/src/pages/options_src/Services/Services.svelte
index 481afb83..6b16e824 100644
--- a/src/pages/options_src/Services/Services.svelte
+++ b/src/pages/options_src/Services/Services.svelte
@@ -72,7 +72,7 @@
             <ServiceIcon details={selection} />
             {selection.label}
           {:else}
-            {browser.i18n.getMessage("search_service") || "Search Service"}
+            {browser.i18n.getMessage("searchService") || "Search Service"}
           {/if}
         </div>
         <div style="font-size: 10px;" slot="chevron-icon">🮦</div>
diff --git a/src/pages/popup_src/App.svelte b/src/pages/popup_src/App.svelte
index 3409052d..2bd16169 100644
--- a/src/pages/popup_src/App.svelte
+++ b/src/pages/popup_src/App.svelte
@@ -88,7 +88,7 @@
 
 <style>
   :global(html, body) {
-    width: 300px;
+    width: 280px;
     height: min-content;
     min-height: auto;
     margin: 0;
-- 
cgit 1.4.1


From 32baa07bdb7b3e9c1da2c839c1ee35dbea10a23b Mon Sep 17 00:00:00 2001
From: ManeraKai <manerakai@protonmail.com>
Date: Sun, 18 Aug 2024 19:30:35 +0300
Subject: Fixed settings reset on ExportSync
 https://github.com/libredirect/browser_extension/issues/974

---
 src/pages/options_src/General/SettingsButtons.svelte | 1 -
 1 file changed, 1 deletion(-)

(limited to 'src/pages/options_src')

diff --git a/src/pages/options_src/General/SettingsButtons.svelte b/src/pages/options_src/General/SettingsButtons.svelte
index 29b756d2..4be747fe 100644
--- a/src/pages/options_src/General/SettingsButtons.svelte
+++ b/src/pages/options_src/General/SettingsButtons.svelte
@@ -44,7 +44,6 @@
 
   async function exportSettingsSync() {
     _options.version = browser.runtime.getManifest().version
-    await servicesHelper.initDefaults()
     browser.storage.sync.set({ options: _options })
   }
 
-- 
cgit 1.4.1


From b8539e9260e6e6a9c74b70ba952d05b53a6d7efe Mon Sep 17 00:00:00 2001
From: ManeraKai <manerakai@protonmail.com>
Date: Sun, 18 Aug 2024 20:31:56 +0300
Subject: Added Redirect Google option
 https://github.com/libredirect/browser_extension/issues/928

---
 src/assets/javascripts/services.js             | 19 +++++++++-----
 src/config.json                                | 35 +++++++++++++++++++++-----
 src/pages/options_src/Services/Services.svelte | 12 ++++++++-
 3 files changed, 53 insertions(+), 13 deletions(-)

(limited to 'src/pages/options_src')

diff --git a/src/assets/javascripts/services.js b/src/assets/javascripts/services.js
index 9b6ef325..60135b73 100644
--- a/src/assets/javascripts/services.js
+++ b/src/assets/javascripts/services.js
@@ -33,12 +33,14 @@ function all(service, frontend, options, config) {
  * @param {{}} config
  * @param {string} frontend
  */
-function regexArray(service, url, config, frontend) {
+function regexArray(service, url, config, options, frontend) {
   let targetList = config.services[service].targets
   if (frontend && "excludeTargets" in config.services[service].frontends[frontend]) {
-    targetList = targetList.filter(
-      val => !config.services[service].frontends[frontend].excludeTargets.includes(targetList.indexOf(val))
-    )
+    if (service !== "search" || !options['search'].redirectGoogle) {
+      targetList = targetList.filter(
+        val => !config.services[service].frontends[frontend].excludeTargets.includes(targetList.indexOf(val))
+      )
+    }
   }
   for (const targetString in targetList) {
     const target = new RegExp(targetList[targetString])
@@ -67,13 +69,17 @@ async function redirectAsync(url, type, initiator, forceRedirection) {
 function rewrite(url, frontend, randomInstance) {
   switch (frontend) {
     case "hyperpipe":
+      for (const key of [...url.searchParams.keys()]) if (key !== "q") url.searchParams.delete(key)
       return `${randomInstance}${url.pathname}${url.search}`.replace(/\/search\?q=.*/, searchQuery =>
         searchQuery.replace("?q=", "/")
       )
     case "searx":
     case "searxng":
+      for (const key of [...url.searchParams.keys()]) if (key !== "q") url.searchParams.delete(key)
+      console.log(url.searchParams)
       return `${randomInstance}/${url.search}`
     case "whoogle":
+      for (const key of [...url.searchParams.keys()]) if (key !== "q") url.searchParams.delete(key)
       return `${randomInstance}/search${url.search}`
     case "4get": {
       const s = url.searchParams.get("q")
@@ -81,6 +87,7 @@ function rewrite(url, frontend, randomInstance) {
       return randomInstance
     }
     case "librey":
+      for (const key in url.searchParams.keys()) if (key != "q") url.searchParams.delete(key)
       return `${randomInstance}/search.php${url.search}`
     case "yattee":
       url.searchParams.delete("si")
@@ -609,7 +616,7 @@ function redirect(url, type, initiator, forceRedirection, incognito) {
     )
       frontend = options[service].embedFrontend
 
-    if (!regexArray(service, url, config, frontend)) {
+    if (!regexArray(service, url, config, options, frontend)) {
       frontend = null
       continue
     }
@@ -652,7 +659,7 @@ function computeService(url, returnFrontend) {
     const config = await utils.getConfig()
     const options = await utils.getOptions()
     for (const service in config.services) {
-      if (regexArray(service, url, config)) {
+      if (regexArray(service, url, config, options)) {
         resolve(service)
         return
       } else {
diff --git a/src/config.json b/src/config.json
index 16bd9076..7a300125 100644
--- a/src/config.json
+++ b/src/config.json
@@ -993,38 +993,61 @@
           "name": "SearXNG",
           "instanceList": true,
           "url": "https://github.com/searxng/searxng",
-          "localhost": true
+          "localhost": true,
+          "excludeTargets": [
+            2,
+            3
+          ]
         },
         "searx": {
           "name": "SearX",
           "instanceList": true,
-          "url": "https://searx.github.io/searx/"
+          "url": "https://searx.github.io/searx/",
+          "excludeTargets": [
+            2,
+            3
+          ]
         },
         "whoogle": {
           "name": "Whoogle",
           "instanceList": true,
-          "url": "https://benbusby.com/projects/whoogle-search/"
+          "url": "https://benbusby.com/projects/whoogle-search/",
+          "excludeTargets": [
+            2,
+            3
+          ]
         },
         "librey": {
           "name": "LibreY",
           "instanceList": true,
-          "url": "https://github.com/Ahwxorg/librey/"
+          "url": "https://github.com/Ahwxorg/librey/",
+          "excludeTargets": [
+            2,
+            3
+          ]
         },
         "4get": {
           "name": "4get",
           "instanceList": true,
-          "url": "https://git.lolcat.ca/lolcat/4get"
+          "url": "https://git.lolcat.ca/lolcat/4get",
+          "excludeTargets": [
+            2,
+            3
+          ]
         }
       },
       "targets": [
         "^https?:\\/{2}search\\.libredirect\\.invalid",
-        "^https?:\\/{2}libredirect\\.github\\.io\\/\\?q"
+        "^https?:\\/{2}libredirect\\.github\\.io\\/\\?q",
+        "^https?:\\/{2}(www\\.)?google\\.com",
+        "^https?:\\/{2}(www\\.)?bing\\.com"
       ],
       "name": "Search",
       "options": {
         "enabled": false,
         "frontend": "searxng",
         "unsupportedUrls": "bypass",
+        "redirectGoogle": false,
         "instance": "public"
       },
       "imageType": "svgMono",
diff --git a/src/pages/options_src/Services/Services.svelte b/src/pages/options_src/Services/Services.svelte
index 6b16e824..f858a3bd 100644
--- a/src/pages/options_src/Services/Services.svelte
+++ b/src/pages/options_src/Services/Services.svelte
@@ -116,7 +116,7 @@
           {browser.i18n.getMessage("frontend") || "Frontend"}
         </a>
       </Label>
-      <div dir="ltr"  on:click={() => (hideFrontendSelection = true)} on:keydown={null}>
+      <div dir="ltr" on:click={() => (hideFrontendSelection = true)} on:keydown={null}>
         <SvelteSelect
           clearable={false}
           dir="ltr"
@@ -172,6 +172,16 @@
     </Row>
 
     {#if selectedService == "search"}
+      <Row>
+        <Label>{browser.i18n.getMessage("redirectGoogle") || "Redirect Google"}</Label>
+        <Checkbox
+          checked={serviceOptions.redirectGoogle}
+          onChange={e => {
+            serviceOptions.redirectGoogle = e.target.checked
+            options.set(_options)
+          }}
+        />
+      </Row>
       <Row>
         <Label>
           {@html browser.i18n.getMessage("searchHint") ||
-- 
cgit 1.4.1


From 3c3cc17ea4df40e82f09ba91a2cc8486f2cc2cba Mon Sep 17 00:00:00 2001
From: ManeraKai <manerakai@protonmail.com>
Date: Sun, 18 Aug 2024 21:00:12 +0300
Subject: Added redirectOnlyInIncognito to each service
 https://github.com/libredirect/browser_extension/issues/954

---
 src/assets/javascripts/services.js             |   2 +
 src/config.json                                | 138 ++++++++++++++++---------
 src/pages/options_src/Services/Services.svelte |  13 +++
 3 files changed, 107 insertions(+), 46 deletions(-)

(limited to 'src/pages/options_src')

diff --git a/src/assets/javascripts/services.js b/src/assets/javascripts/services.js
index 60135b73..1c0e8ce6 100644
--- a/src/assets/javascripts/services.js
+++ b/src/assets/javascripts/services.js
@@ -609,6 +609,8 @@ function redirect(url, type, initiator, forceRedirection, incognito) {
 
     frontend = options[service].frontend
 
+    if (options[service].redirectOnlyInIncognito == true && !incognito) continue
+
     if (
       config.services[service].frontends[frontend].desktopApp &&
       type != "main_frame" &&
diff --git a/src/config.json b/src/config.json
index 7a300125..7a9eaf49 100644
--- a/src/config.json
+++ b/src/config.json
@@ -147,7 +147,8 @@
         "redirectType": "main_frame",
         "frontend": "invidious",
         "embedFrontend": "invidious",
-        "unsupportedUrls": "bypass"
+        "unsupportedUrls": "bypass",
+        "redirectOnlyInIncognito": false
       },
       "imageType": "svg",
       "embeddable": true,
@@ -181,7 +182,8 @@
       "options": {
         "enabled": false,
         "frontend": "hyperpipe",
-        "unsupportedUrls": "bypass"
+        "unsupportedUrls": "bypass",
+        "redirectOnlyInIncognito": false
       },
       "imageType": "svg",
       "url": "https://music.youtube.com"
@@ -210,7 +212,8 @@
         "redirectType": "main_frame",
         "unsupportedUrls": "bypass",
         "frontend": "nitter",
-        "instance": "public"
+        "instance": "public",
+        "redirectOnlyInIncognito": false
       },
       "imageType": "svg",
       "embeddable": true,
@@ -231,7 +234,8 @@
       "options": {
         "enabled": false,
         "unsupportedUrls": "bypass",
-        "frontend": "skyview"
+        "frontend": "skyview",
+        "redirectOnlyInIncognito": false
       },
       "imageType": "svg",
       "url": "https://bsky.app/"
@@ -272,7 +276,8 @@
         "enabled": false,
         "frontend": "libreddit",
         "unsupportedUrls": "bypass",
-        "instance": "public"
+        "instance": "public",
+        "redirectOnlyInIncognito": false
       },
       "imageType": "svg",
       "url": "https://reddit.com"
@@ -298,7 +303,8 @@
         "redirectType": "main_frame",
         "unsupportedUrls": "bypass",
         "frontend": "priviblur",
-        "instance": "public"
+        "instance": "public",
+        "redirectOnlyInIncognito": false
       },
       "imageType": "svg",
       "embeddable": true,
@@ -330,7 +336,8 @@
         "redirectType": "main_frame",
         "unsupportedUrls": "bypass",
         "frontend": "safetwitch",
-        "instance": "public"
+        "instance": "public",
+        "redirectOnlyInIncognito": false
       },
       "imageType": "svg",
       "embeddable": true,
@@ -353,7 +360,8 @@
         "enabled": false,
         "unsupportedUrls": "bypass",
         "frontend": "proxiTok",
-        "instance": "public"
+        "instance": "public",
+        "redirectOnlyInIncognito": false
       },
       "imageType": "svg",
       "url": "https://tiktok.com"
@@ -375,7 +383,8 @@
         "enabled": false,
         "frontend": "proxigram",
         "unsupportedUrls": "bypass",
-        "instance": "public"
+        "instance": "public",
+        "redirectOnlyInIncognito": false
       },
       "imageType": "svg",
       "url": "https://www.instagram.com"
@@ -397,7 +406,8 @@
         "enabled": false,
         "unsupportedUrls": "bypass",
         "frontend": "libremdb",
-        "instance": "public"
+        "instance": "public",
+        "redirectOnlyInIncognito": false
       },
       "imageType": "svg",
       "url": "https://imdb.com"
@@ -418,7 +428,8 @@
       "options": {
         "enabled": false,
         "unsupportedUrls": "bypass",
-        "frontend": "mikuInvidious"
+        "frontend": "mikuInvidious",
+        "redirectOnlyInIncognito": false
       },
       "imageType": "svgMono",
       "url": "https://bilibili.com/"
@@ -438,7 +449,8 @@
       "options": {
         "enabled": false,
         "unsupportedUrls": "bypass",
-        "frontend": "pixivFe"
+        "frontend": "pixivFe",
+        "redirectOnlyInIncognito": false
       },
       "imageType": "svg",
       "url": "https://www.pixiv.net"
@@ -459,7 +471,8 @@
         "enabled": false,
         "unsupportedUrls": "bypass",
         "instance": "public",
-        "frontend": "breezeWiki"
+        "frontend": "breezeWiki",
+        "redirectOnlyInIncognito": false
       },
       "imageType": "svg",
       "url": "https://fandom.com"
@@ -483,7 +496,8 @@
         "redirectType": "main_frame",
         "unsupportedUrls": "bypass",
         "frontend": "rimgo",
-        "instance": "public"
+        "instance": "public",
+        "redirectOnlyInIncognito": false
       },
       "imageType": "svg",
       "embeddable": true,
@@ -507,7 +521,8 @@
         "enabled": false,
         "unsupportedUrls": "bypass",
         "redirectType": "main_frame",
-        "frontend": "binternet"
+        "frontend": "binternet",
+        "redirectOnlyInIncognito": false
       },
       "imageType": "svg",
       "embeddable": true,
@@ -530,7 +545,8 @@
         "enabled": false,
         "redirectType": "main_frame",
         "frontend": "tuboSoundcloud",
-        "unsupportedUrls": "bypass"
+        "unsupportedUrls": "bypass",
+        "redirectOnlyInIncognito": false
       },
       "imageType": "svg",
       "embeddable": false,
@@ -552,7 +568,8 @@
       "options": {
         "enabled": false,
         "unsupportedUrls": "bypass",
-        "frontend": "tent"
+        "frontend": "tent",
+        "redirectOnlyInIncognito": false
       },
       "imageType": "svg",
       "url": "https://bandcamp.com"
@@ -572,7 +589,8 @@
       "options": {
         "enabled": false,
         "unsupportedUrls": "bypass",
-        "frontend": "tekstoLibre"
+        "frontend": "tekstoLibre",
+        "redirectOnlyInIncognito": false
       },
       "imageType": "svg",
       "url": "https://www.tekstowo.pl"
@@ -600,7 +618,8 @@
         "enabled": false,
         "unsupportedUrls": "bypass",
         "frontend": "dumb",
-        "instance": "public"
+        "instance": "public",
+        "redirectOnlyInIncognito": false
       },
       "imageType": "svg",
       "url": "https://genius.com"
@@ -643,7 +662,8 @@
       "options": {
         "frontend": "scribe",
         "enabled": false,
-        "unsupportedUrls": "bypass"
+        "unsupportedUrls": "bypass",
+        "redirectOnlyInIncognito": false
       },
       "imageType": "svg",
       "url": "https://medium.com"
@@ -665,7 +685,8 @@
         "enabled": false,
         "unsupportedUrls": "bypass",
         "frontend": "quetre",
-        "instance": "public"
+        "instance": "public",
+        "redirectOnlyInIncognito": false
       },
       "imageType": "svg",
       "url": "https://quora.com"
@@ -687,7 +708,8 @@
       "options": {
         "enabled": false,
         "unsupportedUrls": "bypass",
-        "frontend": "gothub"
+        "frontend": "gothub",
+        "redirectOnlyInIncognito": false
       },
       "imageType": "svgMono",
       "url": "https://github.com"
@@ -709,7 +731,8 @@
       "options": {
         "enabled": false,
         "unsupportedUrls": "bypass",
-        "frontend": "laboratory"
+        "frontend": "laboratory",
+        "redirectOnlyInIncognito": false
       },
       "imageType": "svg",
       "url": "https://gitlab.com/"
@@ -733,7 +756,8 @@
         "enabled": false,
         "unsupportedUrls": "bypass",
         "frontend": "anonymousOverflow",
-        "instance": "public"
+        "instance": "public",
+        "redirectOnlyInIncognito": false
       },
       "imageType": "svgMono",
       "url": "https://stackoverflow.com/"
@@ -753,7 +777,8 @@
       "options": {
         "enabled": false,
         "unsupportedUrls": "bypass",
-        "frontend": "neuters"
+        "frontend": "neuters",
+        "redirectOnlyInIncognito": false
       },
       "imageType": "svg",
       "url": "https://reuters.com"
@@ -773,7 +798,8 @@
       "options": {
         "enabled": false,
         "unsupportedUrls": "bypass",
-        "frontend": "suds"
+        "frontend": "suds",
+        "redirectOnlyInIncognito": false
       },
       "imageType": "svg",
       "url": "https://www.snopes.com"
@@ -793,7 +819,8 @@
       "options": {
         "enabled": false,
         "unsupportedUrls": "bypass",
-        "frontend": "unfunny"
+        "frontend": "unfunny",
+        "redirectOnlyInIncognito": false
       },
       "imageType": "svg",
       "url": "https://ifunny.co"
@@ -813,7 +840,8 @@
       "options": {
         "enabled": false,
         "unsupportedUrls": "bypass",
-        "frontend": "soprano"
+        "frontend": "soprano",
+        "redirectOnlyInIncognito": false
       },
       "imageType": "svg",
       "url": "https://tenor.com"
@@ -833,7 +861,8 @@
       "options": {
         "enabled": false,
         "unsupportedUrls": "bypass",
-        "frontend": "meme"
+        "frontend": "meme",
+        "redirectOnlyInIncognito": false
       },
       "imageType": "svg",
       "url": "https://knowyourmeme.com"
@@ -853,7 +882,8 @@
       "options": {
         "enabled": false,
         "unsupportedUrls": "bypass",
-        "frontend": "ruralDictionary"
+        "frontend": "ruralDictionary",
+        "redirectOnlyInIncognito": false
       },
       "imageType": "svg",
       "url": "https://urbandictionary.com"
@@ -875,7 +905,8 @@
         "enabled": false,
         "unsupportedUrls": "bypass",
         "frontend": "biblioReads",
-        "instance": "public"
+        "instance": "public",
+        "redirectOnlyInIncognito": false
       },
       "imageType": "svgMono",
       "url": "https://goodreads.com/"
@@ -895,7 +926,8 @@
       "options": {
         "enabled": false,
         "unsupportedUrls": "bypass",
-        "frontend": "wolfreeAlpha"
+        "frontend": "wolfreeAlpha",
+        "redirectOnlyInIncognito": false
       },
       "imageType": "svg",
       "url": "https://www.wolframalpha.com"
@@ -920,7 +952,8 @@
       "options": {
         "enabled": false,
         "unsupportedUrls": "bypass",
-        "frontend": "indestructables"
+        "frontend": "indestructables",
+        "redirectOnlyInIncognito": false
       },
       "imageType": "svg",
       "url": "https://www.instructables.com"
@@ -940,7 +973,8 @@
       "options": {
         "enabled": false,
         "unsupportedUrls": "bypass",
-        "frontend": "wikiless"
+        "frontend": "wikiless",
+        "redirectOnlyInIncognito": false
       },
       "imageType": "svg",
       "url": "https://wikipedia.org"
@@ -960,7 +994,8 @@
       "options": {
         "enabled": false,
         "unsupportedUrls": "bypass",
-        "frontend": "waybackClassic"
+        "frontend": "waybackClassic",
+        "redirectOnlyInIncognito": false
       },
       "imageType": "svgMono",
       "url": "https://web.archive.org"
@@ -981,7 +1016,8 @@
         "enabled": false,
         "unsupportedUrls": "bypass",
         "frontend": "pasted",
-        "instance": "public"
+        "instance": "public",
+        "redirectOnlyInIncognito": false
       },
       "imageType": "svgMono",
       "embeddable": true,
@@ -1048,7 +1084,8 @@
         "frontend": "searxng",
         "unsupportedUrls": "bypass",
         "redirectGoogle": false,
-        "instance": "public"
+        "instance": "public",
+        "redirectOnlyInIncognito": false
       },
       "imageType": "svgMono",
       "url": "https://search.libredirect.invalid"
@@ -1083,7 +1120,8 @@
         "enabled": false,
         "frontend": "simplyTranslate",
         "unsupportedUrls": "bypass",
-        "instance": "public"
+        "instance": "public",
+        "redirectOnlyInIncognito": false
       },
       "imageType": "svgMono",
       "url": "https://translate.libredirect.invalid"
@@ -1106,7 +1144,8 @@
         "redirectType": "main_frame",
         "enabled": false,
         "frontend": "osm",
-        "unsupportedUrls": "bypass"
+        "unsupportedUrls": "bypass",
+        "redirectOnlyInIncognito": false
       },
       "imageType": "svgMono",
       "url": "https://maps.libredirect.invalid"
@@ -1126,7 +1165,8 @@
       "options": {
         "enabled": false,
         "unsupportedUrls": "bypass",
-        "frontend": "jitsi"
+        "frontend": "jitsi",
+        "redirectOnlyInIncognito": false
       },
       "imageType": "svgMono",
       "url": "https://meet.libredirect.invalid"
@@ -1148,7 +1188,8 @@
       "options": {
         "enabled": false,
         "unsupportedUrls": "bypass",
-        "frontend": "send"
+        "frontend": "send",
+        "redirectOnlyInIncognito": false
       },
       "imageType": "svgMono",
       "url": "https://send.libredirect.invalid"
@@ -1173,7 +1214,8 @@
       "options": {
         "enabled": false,
         "unsupportedUrls": "bypass",
-        "frontend": "privateBin"
+        "frontend": "privateBin",
+        "redirectOnlyInIncognito": false
       },
       "imageType": "svgMono",
       "url": "https://paste.libredirect.invalid"
@@ -1193,7 +1235,8 @@
       "options": {
         "enabled": false,
         "unsupportedUrls": "bypass",
-        "frontend": "freetar"
+        "frontend": "freetar",
+        "redirectOnlyInIncognito": false
       },
       "imageType": "svg",
       "url": "https://www.ultimate-guitar.com"
@@ -1213,7 +1256,8 @@
       "options": {
         "enabled": false,
         "unsupportedUrls": "bypass",
-        "frontend": "ratAintTieba"
+        "frontend": "ratAintTieba",
+        "redirectOnlyInIncognito": false
       },
       "imageType": "svg",
       "url": "https://tieba.baidu.com"
@@ -1233,7 +1277,8 @@
       "options": {
         "enabled": false,
         "unsupportedUrls": "bypass",
-        "frontend": "shoelace"
+        "frontend": "shoelace",
+        "redirectOnlyInIncognito": false
       },
       "imageType": "svgMono",
       "url": "https://threads.net"
@@ -1253,7 +1298,8 @@
       "options": {
         "enabled": false,
         "unsupportedUrls": "bypass",
-        "frontend": "skunkyArt"
+        "frontend": "skunkyArt",
+        "redirectOnlyInIncognito": false
       },
       "imageType": "svg",
       "url": "https://deviantart.com"
diff --git a/src/pages/options_src/Services/Services.svelte b/src/pages/options_src/Services/Services.svelte
index f858a3bd..3ad4c850 100644
--- a/src/pages/options_src/Services/Services.svelte
+++ b/src/pages/options_src/Services/Services.svelte
@@ -171,6 +171,19 @@
       />
     </Row>
 
+    <div style={_options.redirectOnlyInIncognito && "pointer-events: none;opacity: 0.4;user-select: none;"}>
+      <Row>
+        <Label>{browser.i18n.getMessage("redirectOnlyInIncognito") || "Redirect Only in Incognito"}</Label>
+        <Checkbox
+          checked={serviceOptions.redirectOnlyInIncognito}
+          onChange={e => {
+            serviceOptions.redirectOnlyInIncognito = e.target.checked
+            options.set(_options)
+          }}
+        />
+      </Row>
+    </div>
+
     {#if selectedService == "search"}
       <Row>
         <Label>{browser.i18n.getMessage("redirectGoogle") || "Redirect Google"}</Label>
-- 
cgit 1.4.1


From dd4b741e4ab7d6892cbc4a4316c73d92ef48efed Mon Sep 17 00:00:00 2001
From: ManeraKai <manerakai@protonmail.com>
Date: Mon, 26 Aug 2024 15:33:25 +0300
Subject: Added Auto Pick Instance
 https://github.com/libredirect/browser_extension/issues/949

---
 src/pages/icons/AutoPickIcon.svelte             | 11 ++++++++
 src/pages/options_src/Services/Instances.svelte | 37 ++++++++++++++++++++++---
 2 files changed, 44 insertions(+), 4 deletions(-)
 create mode 100644 src/pages/icons/AutoPickIcon.svelte

(limited to 'src/pages/options_src')

diff --git a/src/pages/icons/AutoPickIcon.svelte b/src/pages/icons/AutoPickIcon.svelte
new file mode 100644
index 00000000..86adfa28
--- /dev/null
+++ b/src/pages/icons/AutoPickIcon.svelte
@@ -0,0 +1,11 @@
+<svg
+  {...$$restProps}
+  xmlns="http://www.w3.org/2000/svg"
+  height="20px"
+  viewBox="0 -960 960 960"
+  width="20px"
+  fill="currentColor"
+  ><path
+    d="M144-144v-178l342-342-54-53 51-51 72 72 110.22-110.22q4.45-4.45 11.11-7.11Q683-816 691-816t15 2.5q7 2.5 12 7.5l87 88q4.55 5.83 7.27 12.64 2.73 6.8 2.73 14.58t-2.66 14.44q-2.67 6.66-7.11 11.1L696-556l72 73-51 51-54-54-341 342H144Zm72-72h76l320-320-75-76-321 320v76Zm424-385 90-91-38-39-91 90 39 40Zm0 0-39-40 39 40Z"
+  /></svg
+>
diff --git a/src/pages/options_src/Services/Instances.svelte b/src/pages/options_src/Services/Instances.svelte
index 3b870c4b..32425b80 100644
--- a/src/pages/options_src/Services/Instances.svelte
+++ b/src/pages/options_src/Services/Instances.svelte
@@ -5,6 +5,7 @@
   import AddIcon from "../../icons/AddIcon.svelte"
   import { options, config } from "../stores"
   import PingIcon from "../../icons/PingIcon.svelte"
+  import AutoPickIcon from "../../icons/AutoPickIcon.svelte"
   import Row from "../../components/Row.svelte"
   import Input from "../../components/Input.svelte"
   import Label from "../../components/Label.svelte"
@@ -36,10 +37,9 @@
     allInstances = []
     if (_options[selectedFrontend]) allInstances.push(..._options[selectedFrontend])
     if (redirects && redirects[selectedFrontend]) {
-      for (const network in redirects[selectedFrontend]) {
-        allInstances.push(...redirects[selectedFrontend][network])
-      }
+      allInstances.push(...redirects[selectedFrontend]["clearnet"])
     }
+    allInstances = [...new Set(allInstances)]
   }
 
   let pingCache
@@ -64,6 +64,31 @@
       pingCache[instance] = colorTime(time)
     }
   }
+  function randomInstances(n) {
+    let instances = []
+    for (let i = 0; i < n; i++) {
+      instances.push(redirects[selectedFrontend]["clearnet"][Math.floor(Math.random() * allInstances.length)])
+    }
+    return instances
+  }
+
+  async function autoPickInstance() {
+    const instances = randomInstances(5)
+    const myInstancesCache = []
+    for (const instance of instances) {
+      pingCache[instance] = { color: "lightblue", value: "pinging..." }
+      const time = await utils.ping(instance)
+      pingCache[instance] = colorTime(time)
+      myInstancesCache.push([instance, time])
+    }
+    myInstancesCache.sort(function (a, b) {
+      return a[1] - b[1]
+    })
+
+    _options[selectedFrontend].push(myInstancesCache[0][0])
+    options.set(_options)
+  }
+
   function colorTime(time) {
     let value
     let color
@@ -102,11 +127,15 @@
 {#if serviceConf.frontends[selectedFrontend].instanceList && redirects && blacklist}
   <hr />
 
-  <div class="ping">
+  <div>
     <Button on:click={pingInstances}>
       <PingIcon class="margin margin_{document.body.dir}" />
       {browser.i18n.getMessage("pingInstances") || "Ping Instances"}
     </Button>
+    <Button on:click={autoPickInstance}>
+      <AutoPickIcon class="margin margin_{document.body.dir}" />
+      {browser.i18n.getMessage("autoPickInstance") || "Auto Pick Instance"}
+    </Button>
   </div>
 
   <Row>
-- 
cgit 1.4.1


From 97d390737e7e953fe1e6559e41963c547b31afa0 Mon Sep 17 00:00:00 2001
From: ManeraKai <manerakai@protonmail.com>
Date: Thu, 29 Aug 2024 13:36:21 +0300
Subject: Improving popup messages

---
 .gitignore                                      |   3 +-
 package.json                                    |   2 +-
 rollup.config.js                                |   4 +
 src/assets/javascripts/services.js              |  27 +++--
 src/assets/javascripts/utils.js                 |  53 +++++++++-
 src/config.json                                 |   2 +-
 src/pages/background/background.js              |  21 +++-
 src/pages/components/Button.svelte              |  10 +-
 src/pages/messages/index.html                   |  14 +++
 src/pages/messages/no_instance.html             |  24 -----
 src/pages/messages_src/App.svelte               | 132 ++++++++++++++++++++++++
 src/pages/messages_src/main.js                  |   7 ++
 src/pages/messages_src/stores.js                |   5 +
 src/pages/options_src/App.svelte                |  44 +-------
 src/pages/options_src/Services/Instances.svelte |  13 +--
 src/pages/popup_src/App.svelte                  |  42 +-------
 16 files changed, 266 insertions(+), 137 deletions(-)
 create mode 100644 src/pages/messages/index.html
 delete mode 100644 src/pages/messages/no_instance.html
 create mode 100644 src/pages/messages_src/App.svelte
 create mode 100644 src/pages/messages_src/main.js
 create mode 100644 src/pages/messages_src/stores.js

(limited to 'src/pages/options_src')

diff --git a/.gitignore b/.gitignore
index f9768f05..c10438e0 100644
--- a/.gitignore
+++ b/.gitignore
@@ -6,4 +6,5 @@ package-lock.json
 .vscode
 pnpm-lock.yaml
 src/pages/options/build
-src/pages/popup/build
\ No newline at end of file
+src/pages/popup/build
+src/pages/messages/build
\ No newline at end of file
diff --git a/package.json b/package.json
index 7b9fbd11..83705623 100644
--- a/package.json
+++ b/package.json
@@ -14,7 +14,7 @@
     "build": "web-ext build -i pages/options_src -i pages/popup_src pages/icons -i pages/popup_src -i pages/components",
     "build_chromium": "brave-browser --pack-extension=src/ --pack-extension-key=src.pem",
     "test": "web-ext lint",
-    "html": "rollup -c --config-popup && rollup -c --config-options"
+    "html": "rollup -c --config-popup && rollup -c --config-options && rollup -c --config-messages"
   },
   "repository": {
     "type": "git",
diff --git a/rollup.config.js b/rollup.config.js
index 5a2ce362..0bad0c97 100644
--- a/rollup.config.js
+++ b/rollup.config.js
@@ -14,6 +14,10 @@ if (process.argv.includes("--config-options")) {
   input = "src/pages/popup_src/main.js"
   output = "src/pages/popup/build/bundle.js"
 }
+else if (process.argv.includes("--config-messages")) {
+  input = "src/pages/messages_src/main.js"
+  output = "src/pages/messages/build/bundle.js"
+}
 
 export default {
   input,
diff --git a/src/assets/javascripts/services.js b/src/assets/javascripts/services.js
index ee48a1b9..d1c12375 100644
--- a/src/assets/javascripts/services.js
+++ b/src/assets/javascripts/services.js
@@ -610,18 +610,20 @@ function redirect(url, type, originUrl, documentUrl, incognito, forceRedirection
     }
 
     let instanceList = options[frontend]
-    if (instanceList === undefined) break
-    if (instanceList.length === 0) return "https://libredirect.invalid"
+    if (instanceList === undefined) break // should not happen if settings are correct
+
+    if (config.services[service].frontends[frontend].localhost && options[service].instance == "localhost") {
+      randomInstance = `http://${frontend}.localhost:8080`
+    } else if (instanceList.length === 0) {
+      return `https://no-instance.libredirect.invalid?frontend=${encodeURIComponent(frontend)}&url=${encodeURIComponent(url.href)}`
+    } else {
+      randomInstance = utils.getRandomInstance(instanceList)
+    }
 
     if (originUrl && instanceList.includes(originUrl.origin)) {
       if (type == "main_frame") return "BYPASSTAB"
       else return null
     }
-
-    randomInstance = utils.getRandomInstance(instanceList)
-    if (config.services[service].frontends[frontend].localhost && options[service].instance == "localhost") {
-      randomInstance = `http://${frontend}.localhost:8080`
-    }
     break
   }
   if (!frontend) return
@@ -636,7 +638,7 @@ function redirect(url, type, originUrl, documentUrl, incognito, forceRedirection
  * @param {URL} documentUrl
  * @param {boolean} incognito
  * @param {boolean} forceRedirection
- * @returns {string | undefined}
+ * @returns {Promise<string | undefined>}
  */
 async function redirectAsync(url, type, originUrl, documentUrl, incognito, forceRedirection) {
   await init()
@@ -645,9 +647,8 @@ async function redirectAsync(url, type, originUrl, documentUrl, incognito, force
 
 /**
  * @param {URL} url
- * @param {*} returnFrontend
  */
-function computeService(url, returnFrontend) {
+function computeService(url) {
   return new Promise(async resolve => {
     const config = await utils.getConfig()
     const options = await utils.getOptions()
@@ -658,9 +659,7 @@ function computeService(url, returnFrontend) {
       } else {
         for (const frontend in config.services[service].frontends) {
           if (all(service, frontend, options, config).includes(utils.protocolHost(url))) {
-            if (returnFrontend) resolve([service, frontend, utils.protocolHost(url)])
-            else resolve(service)
-            return
+            return resolve(service)
           }
         }
       }
@@ -768,7 +767,7 @@ async function reverse(url) {
 }
 
 const defaultInstances = {
-  invidious: ["https://inv.vern.cc"],
+  // invidious: ["https://inv.vern.cc"],
   materialious: ["https://app.materialio.us"],
   viewtube: ["https://viewtube.io"],
   piped: ["https://pipedapi-libre.kavin.rocks"],
diff --git a/src/assets/javascripts/utils.js b/src/assets/javascripts/utils.js
index 36271a8a..e5b8ba46 100644
--- a/src/assets/javascripts/utils.js
+++ b/src/assets/javascripts/utils.js
@@ -24,7 +24,7 @@ function getNextInstance(currentInstanceUrl, instances) {
  * @param {URL} url
  */
 function protocolHost(url) {
-  url.pathname = url.pathname.replace(/\/$/, '');
+  url.pathname = url.pathname.replace(/\/$/, "")
   if (url.username && url.password) return `${url.protocol}//${url.username}:${url.password}@${url.host}${url.pathname}`
 
   // workaround
@@ -211,6 +211,55 @@ function convertMapCentre(url) {
   return { zoom, lon, lat }
 }
 
+export function randomInstances(clearnet, n) {
+  let instances = []
+  if (n > clearnet.length) n = clearnet.length
+  for (let i = 0; i < n; i++) {
+    const randomNumber = Math.floor(Math.random() * clearnet.length)
+    const randomInstance = clearnet[randomNumber]
+    instances.push(randomInstance)
+  }
+  return instances
+}
+export function style(options, window) {
+  const vars = cssVariables(options, window)
+  return `--text: ${vars.text};
+  --bg-main: ${vars.bgMain};
+  --bg-secondary: ${vars.bgSecondary};
+  --active: ${vars.active};
+  --danger: ${vars.danger};
+  --light-grey: ${vars.lightGrey};`
+}
+
+function cssVariables(options, window) {
+  const dark = {
+    text: "#fff",
+    bgMain: "#121212",
+    bgSecondary: "#202020",
+    active: "#fbc117",
+    danger: "#f04141",
+    lightGrey: "#c3c3c3",
+  }
+
+  const light = {
+    text: "black",
+    bgMain: "white",
+    bgSecondary: "#e4e4e4",
+    active: "#fb9817",
+    danger: "#f04141",
+    lightGrey: "#c3c3c3",
+  }
+  if (options.theme == "dark") {
+    return dark
+  } else if (options.theme == "light") {
+    return light
+  } else if (window.matchMedia("(prefers-color-scheme: dark)").matches) {
+    return dark
+  } else {
+    return light
+  }
+}
+
 export default {
   getRandomInstance,
   getNextInstance,
@@ -225,4 +274,6 @@ export default {
   getQuery,
   prefsEncoded,
   convertMapCentre,
+  randomInstances,
+  style,
 }
diff --git a/src/config.json b/src/config.json
index 6ef3dbe6..045d7f20 100644
--- a/src/config.json
+++ b/src/config.json
@@ -143,7 +143,7 @@
       ],
       "name": "YouTube",
       "options": {
-        "enabled": false,
+        "enabled": true,
         "redirectType": "main_frame",
         "frontend": "invidious",
         "embedFrontend": "invidious",
diff --git a/src/pages/background/background.js b/src/pages/background/background.js
index f41cb55e..db7ad087 100644
--- a/src/pages/background/background.js
+++ b/src/pages/background/background.js
@@ -67,10 +67,25 @@ browser.webRequest.onBeforeRequest.addListener(
       tabIdRedirects[details.tabId]
     )
 
+    if (newUrl && newUrl.startsWith("https://no-instance.libredirect.invalid")) {
+      const url = new URL(newUrl)
+      const frontend = url.searchParams.get("frontend")
+      const oldUrl = new URL(url.searchParams.get("url"))
+
+      browser.tabs.update({
+        url: browser.runtime.getURL(
+          `/pages/messages/index.html?message=no_instance&url=${encodeURIComponent(oldUrl)}&frontend=${encodeURIComponent(frontend)}`
+        ),
+      })
+    }
+
     if (!newUrl) {
-      const match = url.href.match(/^https?:\/{2}(.*\.)?libredirect\.invalid.*/)
-      if (match) {
-        browser.tabs.update({ url: browser.runtime.getURL(`/pages/messages/no_instance.html`) })
+      if (url.href.match(/^https?:\/{2}(.*\.)?libredirect\.invalid.*/)) {
+        browser.tabs.update({
+          url: browser.runtime.getURL(
+            `/pages/messages/index.html?message=disabled&url=${encodeURIComponent(url.href)}`
+          ),
+        })
       }
     }
 
diff --git a/src/pages/components/Button.svelte b/src/pages/components/Button.svelte
index 8836b47e..6ae2ba61 100644
--- a/src/pages/components/Button.svelte
+++ b/src/pages/components/Button.svelte
@@ -19,11 +19,17 @@
     padding: 10px;
   }
 
-  button:hover {
+  button:hover:enabled {
     color: var(--active);
   }
 
-  button:active {
+  button:active:enabled {
     transform: translateY(1px);
   }
+
+  button:disabled {
+    cursor: not-allowed;
+    opacity: 0.5;
+  }
+  
 </style>
diff --git a/src/pages/messages/index.html b/src/pages/messages/index.html
new file mode 100644
index 00000000..8701c152
--- /dev/null
+++ b/src/pages/messages/index.html
@@ -0,0 +1,14 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8" />
+    <meta name="viewport" content="width=device-width,initial-scale=1" />
+    <link rel="icon" type="image/x-icon" href="../../../assets/images/libredirect.svg" />
+    <title>Settings</title>
+    <link rel="stylesheet" href="build/bundle.css" />
+    <link rel="stylesheet" href="../fonts/styles.css" />
+    <script defer src="build/bundle.js"></script>
+  </head>
+
+  <body></body>
+</html>
diff --git a/src/pages/messages/no_instance.html b/src/pages/messages/no_instance.html
deleted file mode 100644
index 55e5fac7..00000000
--- a/src/pages/messages/no_instance.html
+++ /dev/null
@@ -1,24 +0,0 @@
-<!doctype html>
-<html lang="en">
-  <head>
-    <meta charset="UTF-8" />
-    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <link href="../stylesheets/styles.css" rel="stylesheet" />
-    <title>No instances found</title>
-    <style>
-      #body {
-        display: flex;
-        justify-content: center;
-        align-items: center;
-        height: 100vh;
-      }
-    </style>
-  </head>
-
-  <body>
-    <div id="body">
-      <h1>LibRedirect: You have no instance selected for this frontend</h1>
-    </div>
-  </body>
-</html>
diff --git a/src/pages/messages_src/App.svelte b/src/pages/messages_src/App.svelte
new file mode 100644
index 00000000..b08a143b
--- /dev/null
+++ b/src/pages/messages_src/App.svelte
@@ -0,0 +1,132 @@
+<script>
+  const browser = window.browser || window.chrome
+
+  import utils from "../../assets/javascripts/utils.js"
+  import { onDestroy } from "svelte"
+  import servicesHelper from "../../assets/javascripts/services.js"
+  import { onMount } from "svelte"
+
+  import { options, config, page } from "./stores"
+  import Button from "../components/Button.svelte"
+  import AutoPickIcon from "../icons/AutoPickIcon.svelte"
+
+  let _options
+  const unsubscribeOptions = options.subscribe(val => {
+    if (val) {
+      _options = val
+      browser.storage.local.set({ options: val })
+    }
+  })
+
+  let _config
+  const unsubscribeConfig = config.subscribe(val => (_config = val))
+
+  onDestroy(() => {
+    unsubscribeOptions()
+    unsubscribeConfig()
+  })
+
+  onMount(async () => {
+    let opts = await utils.getOptions()
+    if (!opts) {
+      await servicesHelper.initDefaults()
+      opts = await utils.getOptions()
+    }
+    redirects = await utils.getList(opts)
+    options.set(opts)
+    config.set(await utils.getConfig())
+  })
+
+  let _page
+  page.subscribe(val => (_page = val))
+
+  let style
+  $: if (_options) style = utils.style(_options, window)
+
+  let autoPicking = false
+  let redirects
+
+  const params = new URLSearchParams(window.location.search)
+  const oldUrl = new URL(params.get("url"))
+
+  async function autoPickInstance() {
+    const frontend = params.get("frontend")
+    autoPicking = true
+    const instances = utils.randomInstances(redirects[frontend]["clearnet"], 5)
+    const pings = await Promise.all([...instances.map(async instance => [instance, await utils.ping(instance)])])
+    pings.sort((a, b) => a[1] - b[1])
+    console.log(pings)
+    _options[frontend].push(pings[0][0])
+    options.set(_options)
+    autoPicking = false
+    await redirectUrl()
+  }
+
+  async function enableService() {
+    const service = await servicesHelper.computeService(oldUrl)
+    _options[service].enabled = true
+    options.set(_options)
+    await redirectUrl()
+  }
+
+  async function redirectUrl() {
+    const newUrl = await servicesHelper.redirectAsync(oldUrl, "main_frame", null, null, false, true)
+    browser.tabs.update({ url: newUrl })
+  }
+</script>
+
+{#if _options && _config}
+  <div class="main" dir="auto" {style}>
+    {#if window.location.search.includes("message=disabled")}
+      <div>
+        <h1>You disabled redirections for this service</h1>
+        <Button on:click={enableService}>
+          {browser.i18n.getMessage("enable") || "Enable"}
+        </Button>
+      </div>
+    {:else if window.location.search.includes("message=no_instance")}
+      <div>
+        <h1>You have no instance selected for this frontend</h1>
+        <Button on:click={autoPickInstance} disabled={autoPicking}>
+          <AutoPickIcon class="margin margin_{document.body.dir}" />
+          {browser.i18n.getMessage("autoPickInstance") || "Auto Pick Instance"}
+        </Button>
+      </div>
+    {/if}
+  </div>
+{:else}
+  <p>Loading...</p>
+{/if}
+
+<style>
+  :global(body) {
+    width: 100vw;
+    height: 100vh;
+    margin: 0;
+    padding: 0;
+  }
+
+  div.main {
+    height: 100%;
+    display: grid;
+    grid-template-columns: 800px;
+    margin: 0;
+    padding-top: 50px;
+    justify-content: center;
+    font-family: "Inter", sans-serif;
+    box-sizing: border-box;
+    font-size: 16px;
+    background-color: var(--bg-main);
+    color: var(--text);
+    overflow: scroll;
+  }
+
+  :global(.margin) {
+    margin-right: 10px;
+    margin-left: 0;
+  }
+  :global(.margin_rtl) {
+    margin-right: 0;
+    margin-left: 10px;
+  }
+</style>
diff --git a/src/pages/messages_src/main.js b/src/pages/messages_src/main.js
new file mode 100644
index 00000000..c4012f4a
--- /dev/null
+++ b/src/pages/messages_src/main.js
@@ -0,0 +1,7 @@
+import App from "./App.svelte"
+
+const app = new App({
+  target: document.body,
+})
+
+export default app
diff --git a/src/pages/messages_src/stores.js b/src/pages/messages_src/stores.js
new file mode 100644
index 00000000..782f6064
--- /dev/null
+++ b/src/pages/messages_src/stores.js
@@ -0,0 +1,5 @@
+import { writable } from "svelte/store"
+
+export const options = writable(null)
+export const config = writable(null)
+export const page = writable("general")
diff --git a/src/pages/options_src/App.svelte b/src/pages/options_src/App.svelte
index 565aacef..1c4830bf 100644
--- a/src/pages/options_src/App.svelte
+++ b/src/pages/options_src/App.svelte
@@ -2,7 +2,7 @@
   const browser = window.browser || window.chrome
 
   import General from "./General/General.svelte"
-  import url from './url'
+  import url from "./url"
   import utils from "../../assets/javascripts/utils.js"
   import { onDestroy } from "svelte"
   import servicesHelper from "../../assets/javascripts/services.js"
@@ -37,51 +37,15 @@
     config.set(await utils.getConfig())
   })
 
-  const dark = {
-    text: "#fff",
-    bgMain: "#121212",
-    bgSecondary: "#202020",
-    active: "#fbc117",
-    danger: "#f04141",
-    lightGrey: "#c3c3c3",
-  }
-  const light = {
-    text: "black",
-    bgMain: "white",
-    bgSecondary: "#e4e4e4",
-    active: "#fb9817",
-    danger: "#f04141",
-    lightGrey: "#c3c3c3",
-  }
-  let cssVariables
-  $: if (_options) {
-    if (_options.theme == "dark") {
-      cssVariables = dark
-    } else if (_options.theme == "light") {
-      cssVariables = light
-    } else if (window.matchMedia("(prefers-color-scheme: dark)").matches) {
-      cssVariables = dark
-    } else {
-      cssVariables = light
-    }
-  }
+  let style
+  $: if (_options) style = utils.style(_options, window)
 
   const dir = ["ar", "iw", "ku", "fa", "ur"].includes(browser.i18n.getUILanguage()) ? "rtl" : "ltr"
   document.body.dir = dir
 </script>
 
 {#if _options && _config}
-  <div
-    class={dir}
-    {dir}
-    style="
-    --text: {cssVariables.text};
-    --bg-main: {cssVariables.bgMain};
-    --bg-secondary: {cssVariables.bgSecondary};
-    --active: {cssVariables.active};
-    --danger: {cssVariables.danger};
-    --light-grey: {cssVariables.lightGrey};"
-  >
+  <div class={dir} {dir} {style}>
     <Sidebar />
     {#if !$url.hash || $url.hash == "#general"}
       <General />
diff --git a/src/pages/options_src/Services/Instances.svelte b/src/pages/options_src/Services/Instances.svelte
index 32425b80..4e5d1e7d 100644
--- a/src/pages/options_src/Services/Instances.svelte
+++ b/src/pages/options_src/Services/Instances.svelte
@@ -64,16 +64,9 @@
       pingCache[instance] = colorTime(time)
     }
   }
-  function randomInstances(n) {
-    let instances = []
-    for (let i = 0; i < n; i++) {
-      instances.push(redirects[selectedFrontend]["clearnet"][Math.floor(Math.random() * allInstances.length)])
-    }
-    return instances
-  }
 
   async function autoPickInstance() {
-    const instances = randomInstances(5)
+    const instances = utils.randomInstances(redirects[selectedFrontend]["clearnet"], 5)
     const myInstancesCache = []
     for (const instance of instances) {
       pingCache[instance] = { color: "lightblue", value: "pinging..." }
@@ -81,9 +74,7 @@
       pingCache[instance] = colorTime(time)
       myInstancesCache.push([instance, time])
     }
-    myInstancesCache.sort(function (a, b) {
-      return a[1] - b[1]
-    })
+    myInstancesCache.sort((a, b) => a[1] - b[1])
 
     _options[selectedFrontend].push(myInstancesCache[0][0])
     options.set(_options)
diff --git a/src/pages/popup_src/App.svelte b/src/pages/popup_src/App.svelte
index 8f958a3e..f6699312 100644
--- a/src/pages/popup_src/App.svelte
+++ b/src/pages/popup_src/App.svelte
@@ -38,48 +38,12 @@
   let _page
   page.subscribe(val => (_page = val))
 
-  const dark = {
-    text: "#fff",
-    bgMain: "#121212",
-    bgSecondary: "#202020",
-    active: "#fbc117",
-    danger: "#f04141",
-    lightGrey: "#c3c3c3",
-  }
-  const light = {
-    text: "black",
-    bgMain: "white",
-    bgSecondary: "#e4e4e4",
-    active: "#fb9817",
-    danger: "#f04141",
-    lightGrey: "#c3c3c3",
-  }
-  let cssVariables
-  $: if (_options) {
-    if (_options.theme == "dark") {
-      cssVariables = dark
-    } else if (_options.theme == "light") {
-      cssVariables = light
-    } else if (window.matchMedia("(prefers-color-scheme: dark)").matches) {
-      cssVariables = dark
-    } else {
-      cssVariables = light
-    }
-  }
+  let style
+  $: if (_options) style = utils.style(_options, window)
 </script>
 
 {#if _options && _config}
-  <div
-    class="main"
-    dir="auto"
-    style="
-    --text: {cssVariables.text};
-    --bg-main: {cssVariables.bgMain};
-    --bg-secondary: {cssVariables.bgSecondary};
-    --active: {cssVariables.active};
-    --danger: {cssVariables.danger};
-    --light-grey: {cssVariables.lightGrey};"
-  >
+  <div class="main" dir="auto" {style}>
     <Buttons />
   </div>
 {:else}
-- 
cgit 1.4.1


From 79e134a1873e6897107b1f2acb4437030cea2425 Mon Sep 17 00:00:00 2001
From: ManeraKai <manerakai@protonmail.com>
Date: Sat, 31 Aug 2024 11:47:11 +0300
Subject: small UI improvements

---
 src/pages/background/background.js             | 29 +++++++++++++++++---------
 src/pages/messages_src/App.svelte              |  8 +++----
 src/pages/options_src/Services/Services.svelte |  2 ++
 3 files changed, 25 insertions(+), 14 deletions(-)

(limited to 'src/pages/options_src')

diff --git a/src/pages/background/background.js b/src/pages/background/background.js
index 2bb6cb57..0d558b01 100644
--- a/src/pages/background/background.js
+++ b/src/pages/background/background.js
@@ -71,17 +71,21 @@ browser.webRequest.onBeforeRequest.addListener(
       const url = new URL(newUrl)
       const frontend = url.searchParams.get("frontend")
       const oldUrl = new URL(url.searchParams.get("url"))
-
-      newUrl = browser.runtime.getURL(
-        `/pages/messages/index.html?message=no_instance&url=${encodeURIComponent(oldUrl)}&frontend=${encodeURIComponent(frontend)}`
-      )
+      const params = new URLSearchParams({
+        message: "no_instance",
+        url: oldUrl,
+        frontend: frontend,
+      })
+      newUrl = browser.runtime.getURL(`/pages/messages/index.html?${params.toString()}`)
     }
 
     if (!newUrl) {
       if (url.href.match(/^https?:\/{2}(.*\.)?libredirect\.invalid.*/)) {
-        newUrl = browser.runtime.getURL(
-          `/pages/messages/index.html?message=disabled&url=${encodeURIComponent(url.href)}`
-        )
+        const params = new URLSearchParams({
+          message: "disabled",
+          url: url.href,
+        })
+        newUrl = browser.runtime.getURL(`/pages/messages/index.html?${params.toString()}`)
       }
     }
 
@@ -110,10 +114,15 @@ browser.webRequest.onHeadersReceived.addListener(
       const url = new URL(details.url)
       const { service, frontend } = servicesHelper.computeFrontend(url)
       if (!service) return
+      const params = new URLSearchParams({
+        message: "server_error",
+        code: details.statusCode,
+        url: url.href,
+        frontend: frontend,
+        service: service,
+      })
       browser.tabs.update({
-        url: browser.runtime.getURL(
-          `/pages/messages/index.html?message=server_error&code=${details.statusCode}=&url=${encodeURIComponent(url.href)}&frontend=${encodeURIComponent(frontend)}&service=${encodeURIComponent(service)}`
-        ),
+        url: browser.runtime.getURL(`/pages/messages/index.html?${params.toString()}`),
       })
     }
   },
diff --git a/src/pages/messages_src/App.svelte b/src/pages/messages_src/App.svelte
index 05a78044..6d68ff5f 100644
--- a/src/pages/messages_src/App.svelte
+++ b/src/pages/messages_src/App.svelte
@@ -112,17 +112,17 @@
 
 {#if _options && _config}
   <div class="main" dir="auto" {style}>
-    {#if window.location.search.includes("message=disabled")}
+    {#if params.get("message") == "disabled"}
       <div>
         <h1>You disabled redirections for this service</h1>
         <Button on:click={enableService}>
           {browser.i18n.getMessage("enable") || "Enable"}
         </Button>
       </div>
-    {:else if window.location.search.includes("message=server_error")}
+    {:else if params.get("message") == "server_error"}
       <!-- https://httpstat.us/403 for testing -->
       <div>
-        <h1>Your selected instance gave out an error</h1>
+        <h1>Your selected instance gave out an error: {params.get("code")}</h1>
         {#if _options[params.get("frontend")].length > 1}
           <Button on:click={switchInstance}>
             <SwitchInstanceIcon class="margin margin_{document.body.dir}" />
@@ -147,7 +147,7 @@
           </Button>
         {/if}
       </div>
-    {:else if window.location.search.includes("message=no_instance")}
+    {:else if params.get("message") == "no_instance"}
       <div>
         <h1>You have no instance selected for this frontend</h1>
         <Button on:click={autoPickInstance} disabled={autoPicking}>
diff --git a/src/pages/options_src/Services/Services.svelte b/src/pages/options_src/Services/Services.svelte
index 3ad4c850..db2977f9 100644
--- a/src/pages/options_src/Services/Services.svelte
+++ b/src/pages/options_src/Services/Services.svelte
@@ -51,6 +51,7 @@
           window.location.hash = `services:${e.detail.value}`
           hideServiceSelection = false
         }}
+        on:pointerup={() => (hideServiceSelection = false)}
         on:focus={() => (hideServiceSelection = true)}
         on:blur={() => (hideServiceSelection = false)}
         items={[
@@ -128,6 +129,7 @@
             options.set(_options)
             hideFrontendSelection = false
           }}
+          on:pointerup={() => (hideServiceSelection = false)}
           on:focus={() => (hideFrontendSelection = true)}
           on:blur={() => (hideFrontendSelection = false)}
           items={[
-- 
cgit 1.4.1