From 23a2df4d86cbebba58a6e40d099c3a21d8150544 Mon Sep 17 00:00:00 2001
From: Max Patiiuk <max@patii.uk>
Date: Mon, 4 Jul 2022 21:40:00 -0500
Subject: [PATCH] Add a way to temporary disable field labels

Fixes #1330
---
 .../frontend/js_src/lib/cachedefinitions.ts   |  1 +
 .../js_src/lib/components/formdefinition.tsx  | 51 +++++++++++++++----
 .../js_src/lib/localization/forms.tsx         |  4 ++
 .../frontend/js_src/lib/specifymodel.ts       | 22 ++++++--
 4 files changed, 63 insertions(+), 15 deletions(-)

diff --git a/specifyweb/frontend/js_src/lib/cachedefinitions.ts b/specifyweb/frontend/js_src/lib/cachedefinitions.ts
index 7e261b4bce6..5e161721e3c 100644
--- a/specifyweb/frontend/js_src/lib/cachedefinitions.ts
+++ b/specifyweb/frontend/js_src/lib/cachedefinitions.ts
@@ -38,6 +38,7 @@ export type CacheDefinitions = {
       readonly [TABLE_NAME in keyof Tables]?: boolean;
     };
     readonly carryForwardShowHidden: boolean;
+    readonly useFieldLabels: boolean;
   };
   readonly wbPlanViewUi: {
     /** Whether to show less commonly used tables when selected base table */
diff --git a/specifyweb/frontend/js_src/lib/components/formdefinition.tsx b/specifyweb/frontend/js_src/lib/components/formdefinition.tsx
index def29454b62..27144ef63e1 100644
--- a/specifyweb/frontend/js_src/lib/components/formdefinition.tsx
+++ b/specifyweb/frontend/js_src/lib/components/formdefinition.tsx
@@ -34,6 +34,20 @@ function FormDefinitionDialog({
   readonly model: SpecifyModel;
   readonly onClose: () => void;
 }): JSX.Element {
+  return (
+    <Dialog
+      header={commonText('formDefinition')}
+      buttons={commonText('close')}
+      onClose={handleClose}
+    >
+      <UseAutoForm model={model} />
+      <UseLabels />
+      <EditFormDefinition />
+    </Dialog>
+  );
+}
+
+function UseAutoForm({ model }: { readonly model: SpecifyModel }): JSX.Element {
   const [globalConfig = {}, setGlobalConfig] = useCachedState({
     category: 'forms',
     key: 'useCustomForm',
@@ -45,17 +59,32 @@ function FormDefinitionDialog({
     setGlobalConfig({ ...globalConfig, [model.name]: !checked });
 
   return (
-    <Dialog
-      header={commonText('formDefinition')}
-      buttons={commonText('close')}
-      onClose={handleClose}
-    >
-      <Label.ForCheckbox>
-        <Input.Checkbox checked={!useCustomForm} onValueChange={handleChange} />
-        {formsText('useAutoGeneratedForm')}
-      </Label.ForCheckbox>
-      <EditFormDefinition />
-    </Dialog>
+    <Label.ForCheckbox>
+      <Input.Checkbox checked={!useCustomForm} onValueChange={handleChange} />
+      {formsText('useAutoGeneratedForm')}
+    </Label.ForCheckbox>
+  );
+}
+
+function UseLabels(): JSX.Element {
+  const [useFieldLabels = true, setUseFieldLabels] = useCachedState({
+    category: 'forms',
+    key: 'useFieldLabels',
+    defaultValue: true,
+    staleWhileRefresh: false,
+  });
+
+  return (
+    <Label.ForCheckbox>
+      <Input.Checkbox
+        checked={useFieldLabels}
+        onValueChange={(checked): void => {
+          setUseFieldLabels(checked);
+          window.location.reload();
+        }}
+      />
+      {formsText('useFieldLabels')}
+    </Label.ForCheckbox>
   );
 }
 
diff --git a/specifyweb/frontend/js_src/lib/localization/forms.tsx b/specifyweb/frontend/js_src/lib/localization/forms.tsx
index da30524a758..798367183f3 100644
--- a/specifyweb/frontend/js_src/lib/localization/forms.tsx
+++ b/specifyweb/frontend/js_src/lib/localization/forms.tsx
@@ -680,6 +680,10 @@ export const formsText = createDictionary({
     'en-us': 'Use Auto Generated Form',
     'ru-ru': 'Использовать автоматическую схему формы',
   },
+  useFieldLabels: {
+    'en-us': 'Use localized field labels',
+    'ru-ru': 'Использовать локализованные названия полей',
+  },
   historyOfEdits: {
     'en-us': 'History of edits',
     'ru-ru': 'История изменений',
diff --git a/specifyweb/frontend/js_src/lib/specifymodel.ts b/specifyweb/frontend/js_src/lib/specifymodel.ts
index b0fd0abcffb..cdf34d18e26 100644
--- a/specifyweb/frontend/js_src/lib/specifymodel.ts
+++ b/specifyweb/frontend/js_src/lib/specifymodel.ts
@@ -35,6 +35,7 @@ import {
 import { isTreeResource } from './treedefinitions';
 import type { IR, R, RA } from './types';
 import { defined } from './types';
+import { getCache } from './cache';
 
 type FieldAlias = {
   readonly vname: string;
@@ -219,13 +220,25 @@ export class SpecifyModel<SCHEMA extends AnySchema = AnySchema> {
       model: this.Resource,
     });
 
+    const useLabels = getCache('forms', 'useFieldLabels') ?? true;
     this.localization = getSchemaLocalization()[this.name.toLowerCase()] ?? {
       items: {},
     };
+    if (!useLabels)
+      this.localization = {
+        ...this.localization,
+        items: Object.fromEntries(
+          Object.entries(this.localization.items).map(([fieldName, data]) => [
+            fieldName,
+            { ...data, name: fieldName },
+          ])
+        ),
+      };
+
     (this.localization.items as R<SchemaLocalization['items'][string]>)[
       tableDefinition.idFieldName.toLowerCase()
     ] ??= {
-      name: commonText('id'),
+      name: useLabels ? commonText('id') : tableDefinition.idFieldName,
       desc: null,
       format: null,
       picklistname: null,
@@ -244,10 +257,11 @@ export class SpecifyModel<SCHEMA extends AnySchema = AnySchema> {
       readOnly: false,
     });
 
-    this.label =
-      typeof this.localization.name === 'string'
+    this.label = useLabels
+      ? typeof this.localization.name === 'string'
         ? unescape(this.localization.name)
-        : camelToHuman(this.name);
+        : camelToHuman(this.name)
+      : this.name;
 
     this.isHidden = this.localization.ishidden === 1;