From a204105b5b5d7368b6ee55811eb346d746057ae9 Mon Sep 17 00:00:00 2001
From: Sebastian <sebasjm@gmail.com>
Date: Mon, 7 Aug 2023 08:14:21 -0300
Subject: show advance mode in settings view

---
 .../src/paths/settings/index.tsx                   | 64 +++++++++++++++++++++-
 1 file changed, 63 insertions(+), 1 deletion(-)

(limited to 'packages/merchant-backoffice-ui/src/paths')

diff --git a/packages/merchant-backoffice-ui/src/paths/settings/index.tsx b/packages/merchant-backoffice-ui/src/paths/settings/index.tsx
index 1d0b4128a..128450553 100644
--- a/packages/merchant-backoffice-ui/src/paths/settings/index.tsx
+++ b/packages/merchant-backoffice-ui/src/paths/settings/index.tsx
@@ -1,12 +1,74 @@
 import { VNode, h } from "preact";
+import { LangSelector } from "../../components/menu/LangSelector.js";
+import { useLang, useTranslationContext } from "@gnu-taler/web-util/browser";
+import { InputToggle } from "../../components/form/InputToggle.js";
+import { Settings, useSettings } from "../../hooks/useSettings.js";
+import { FormErrors, FormProvider } from "../../components/form/FormProvider.js";
+import { useState } from "preact/hooks";
+
+function getBrowserLang(): string | undefined {
+  if (typeof window === "undefined") return undefined;
+  if (window.navigator.languages) return window.navigator.languages[0];
+  if (window.navigator.language) return window.navigator.language;
+  return undefined;
+}
 
 export function Settings(): VNode {
+  const { i18n } = useTranslationContext()
+  const borwserLang = getBrowserLang()
+  const { update } = useLang()
+
+  const [value, updateValue] = useSettings()
+  const errors: FormErrors<Settings> = {
+  }
+
+  function valueHandler(s: (d: Partial<Settings>) => Partial<Settings>): void {
+    const next = s(value)
+    updateValue("advanceOrderMode", next.advanceOrderMode ?? false)
+  }
+
   return <div>
     <section class="section is-main-section">
       <div class="columns">
         <div class="column" />
         <div class="column is-four-fifths">
-          settings view
+          <div class="field is-horizontal">
+            <div class="field-label is-normal">
+              <label class="label" style={{ width: 200 }}>
+                <i18n.Translate>Language</i18n.Translate>
+                <span class="icon has-tooltip-right" data-tooltip={"Force language setting instance of taking the browser"}>
+                  <i class="mdi mdi-information" />
+                </span>
+              </label>
+            </div>
+            <div class="field has-addons">
+              <LangSelector />
+              &nbsp;
+              {borwserLang !== undefined && <button
+                data-tooltip={i18n.str`generate random secret key`}
+                class="button is-info mr-3"
+                onClick={(e) => {
+                  update(borwserLang.substring(0, 2))
+                }}
+              >
+                <i18n.Translate>Set default</i18n.Translate>
+              </button>}
+            </div>
+          </div>
+          <FormProvider<Settings>
+            name="settings"
+            errors={errors}
+            object={value}
+            valueHandler={valueHandler}
+          >
+            <InputToggle<Settings>
+              label={i18n.str`Advance order creation`}
+              tooltip={i18n.str`Shows more options in the order creation form`}
+              name="advanceOrderMode"
+            />
+          </FormProvider>
+
+
         </div>
         <div class="column" />
       </div>
-- 
cgit v1.2.3