From a210a8b479d9b3d2cd81a1ffb289f9b2cfa13fed Mon Sep 17 00:00:00 2001
From: SkyratBot <59378654+SkyratBot@users.noreply.github.com>
Date: Sun, 10 Oct 2021 16:38:25 +0200
Subject: [PATCH] [MIRROR] Add reset keybindings button, fix scaling on tabbed
 list buttons [MDB IGNORE] (#8740)

* Add reset keybindings button (#61942)

* Add reset keybindings button, fix scaling on tabbed list buttons

Co-authored-by: Mothblocks <35135081+Mothblocks@users.noreply.github.com>
---
 .../preferences/middleware/keybindings.dm     |   8 ++
 .../PreferencesMenu/KeybindingsPage.tsx       | 109 ++++++++++--------
 .../interfaces/PreferencesMenu/TabbedMenu.tsx |   2 +-
 3 files changed, 70 insertions(+), 49 deletions(-)

diff --git a/code/modules/client/preferences/middleware/keybindings.dm b/code/modules/client/preferences/middleware/keybindings.dm
index e51852b408b..7cb41269743 100644
--- a/code/modules/client/preferences/middleware/keybindings.dm
+++ b/code/modules/client/preferences/middleware/keybindings.dm
@@ -3,6 +3,7 @@
 /// Middleware to handle keybindings
 /datum/preference_middleware/keybindings
 	action_delegations = list(
+		"reset_all_keybinds" = .proc/reset_all_keybinds,
 		"reset_keybinds_to_defaults" = .proc/reset_keybinds_to_defaults,
 		"set_keybindings" = .proc/set_keybindings,
 	)
@@ -22,6 +23,13 @@
 		get_asset_datum(/datum/asset/json/keybindings)
 	)
 
+/datum/preference_middleware/keybindings/proc/reset_all_keybinds(list/params, mob/user)
+	preferences.key_bindings = deepCopyList(GLOB.default_hotkeys)
+	preferences.key_bindings_by_key = preferences.get_key_bindings_by_key(preferences.key_bindings)
+	preferences.update_static_data(user)
+
+	return TRUE
+
 /datum/preference_middleware/keybindings/proc/reset_keybinds_to_defaults(list/params, mob/user)
 	var/keybind_name = params["keybind_name"]
 	var/datum/keybinding/keybinding = GLOB.keybindings_by_name[keybind_name]
diff --git a/tgui/packages/tgui/interfaces/PreferencesMenu/KeybindingsPage.tsx b/tgui/packages/tgui/interfaces/PreferencesMenu/KeybindingsPage.tsx
index c05e89cc257..e80bfef0f6c 100644
--- a/tgui/packages/tgui/interfaces/PreferencesMenu/KeybindingsPage.tsx
+++ b/tgui/packages/tgui/interfaces/PreferencesMenu/KeybindingsPage.tsx
@@ -374,6 +374,7 @@ export class KeybindingsPage extends Component<{}, KeybindingsPageState> {
   }
 
   render() {
+    const { act } = useBackend(this.context);
     const keybindings = this.state.keybindings;
 
     if (!keybindings) {
@@ -394,58 +395,70 @@ export class KeybindingsPage extends Component<{}, KeybindingsPageState> {
           onKeyUp={this.handleKeyUp}
         />
 
-        <TabbedMenu
-          categoryEntries={keybindingEntries.map(
-            ([category, keybindings]) => {
-              return [category, (
-                <Stack key={category} vertical fill>
-                  {sortKeybindings(Object.entries(keybindings)).map(
-                    ([keybindingId, keybinding]) => {
-                      const keys
+        <Stack vertical fill>
+          <Stack.Item grow>
+            <TabbedMenu
+              categoryEntries={keybindingEntries.map(
+                ([category, keybindings]) => {
+                  return [category, (
+                    <Stack key={category} vertical fill>
+                      {sortKeybindings(Object.entries(keybindings)).map(
+                        ([keybindingId, keybinding]) => {
+                          const keys
                         = this.state.selectedKeybindings![keybindingId]
                           || [];
 
-                      const name = (
-                        <Stack.Item basis="25%">
-                          <KeybindingName keybinding={keybinding} />
-                        </Stack.Item>
-                      );
-
-                      return (
-                        <Stack.Item key={keybindingId}>
-                          <Stack fill>
-                            {name}
-
-                            {range(0, 3).map(key => (
-                              <Stack.Item key={key} grow basis="10%">
-                                <KeybindingButton
-                                  currentHotkey={keys[key]}
-                                  typingHotkey={this.getTypingHotkey(
-                                    keybindingId,
-                                    key,
-                                  )}
-                                  onClick={this.getKeybindingOnClick(
-                                    keybindingId,
-                                    key,
-                                  )}
-                                />
-                              </Stack.Item>
-                            ))}
-
-                            <Stack.Item shrink>
-                              <ResetToDefaultButton
-                                keybindingId={keybindingId} />
+                          const name = (
+                            <Stack.Item basis="25%">
+                              <KeybindingName keybinding={keybinding} />
                             </Stack.Item>
-                          </Stack>
-                        </Stack.Item>
-                      );
-                    }
-                  )}
-                </Stack>
-              )];
-            }
-          )}
-        />
+                          );
+
+                          return (
+                            <Stack.Item key={keybindingId}>
+                              <Stack fill>
+                                {name}
+
+                                {range(0, 3).map(key => (
+                                  <Stack.Item key={key} grow basis="10%">
+                                    <KeybindingButton
+                                      currentHotkey={keys[key]}
+                                      typingHotkey={this.getTypingHotkey(
+                                        keybindingId,
+                                        key,
+                                      )}
+                                      onClick={this.getKeybindingOnClick(
+                                        keybindingId,
+                                        key,
+                                      )}
+                                    />
+                                  </Stack.Item>
+                                ))}
+
+                                <Stack.Item shrink>
+                                  <ResetToDefaultButton
+                                    keybindingId={keybindingId} />
+                                </Stack.Item>
+                              </Stack>
+                            </Stack.Item>
+                          );
+                        }
+                      )}
+                    </Stack>
+                  )];
+                }
+              )}
+            />
+          </Stack.Item>
+
+          <Stack.Item align="center">
+            <Button.Confirm
+              content="Reset all keybindings"
+              onClick={() => act("reset_all_keybinds")}
+            />
+          </Stack.Item>
+
+        </Stack>
       </>
     );
   }
diff --git a/tgui/packages/tgui/interfaces/PreferencesMenu/TabbedMenu.tsx b/tgui/packages/tgui/interfaces/PreferencesMenu/TabbedMenu.tsx
index 450bf0dc3e4..267f624c19f 100644
--- a/tgui/packages/tgui/interfaces/PreferencesMenu/TabbedMenu.tsx
+++ b/tgui/packages/tgui/interfaces/PreferencesMenu/TabbedMenu.tsx
@@ -26,7 +26,7 @@ export class TabbedMenu extends Component<TabbedMenuProps> {
           <Stack fill px={5}>
             {this.props.categoryEntries.map(([category]) => {
               return (
-                <Stack.Item key={category} grow>
+                <Stack.Item key={category} grow basis="content">
                   <Button
                     align="center"
                     fontSize="1.2em"