From 8b8d58c6702032d1ed9dfd6f6392d4b6eadf2407 Mon Sep 17 00:00:00 2001
From: Jeong Arm <kjwonmail@gmail.com>
Date: Sat, 13 Nov 2021 03:11:51 +0900
Subject: [PATCH] Rename, move, fix code

---
 app/javascript/flavours/glitch/packs/admin.js | 49 ++++++++++---------
 1 file changed, 26 insertions(+), 23 deletions(-)

diff --git a/app/javascript/flavours/glitch/packs/admin.js b/app/javascript/flavours/glitch/packs/admin.js
index 31718998d..b26df932c 100644
--- a/app/javascript/flavours/glitch/packs/admin.js
+++ b/app/javascript/flavours/glitch/packs/admin.js
@@ -1,10 +1,33 @@
 import 'packs/public-path';
 import loadPolyfills from 'flavours/glitch/util/load_polyfills';
 import ready from 'flavours/glitch/util/ready';
+import loadKeyboardExtensions from 'flavours/glitch/util/load_keyboard_extensions';
 
-function setupSidebar() {
+function main() {
   const { delegate } = require('@rails/ujs');
 
+  ready(() => {
+    const React    = require('react');
+    const ReactDOM = require('react-dom');
+
+    [].forEach.call(document.querySelectorAll('[data-admin-component]'), element => {
+      const componentName  = element.getAttribute('data-admin-component');
+      const { locale, ...componentProps } = JSON.parse(element.getAttribute('data-props'));
+
+      import('flavours/glitch/containers/admin_component').then(({ default: AdminComponent }) => {
+        return import('flavours/glitch/components/admin/' + componentName).then(({ default: Component }) => {
+          ReactDOM.render((
+            <AdminComponent locale={locale}>
+              <Component {...componentProps} />
+            </AdminComponent>
+          ), element);
+        });
+      }).catch(error => {
+        console.error(error);
+      });
+    });
+  });
+
   delegate(document, '.sidebar__toggle__icon', 'click', () => {
     const target = document.querySelector('.sidebar ul');
 
@@ -17,29 +40,9 @@ function setupSidebar() {
 }
 
 loadPolyfills()
-  .then(setupSidebar)
+  .then(main)
+  .then(loadKeyboardExtensions)
   .catch(error => {
     console.error(error);
-  });
 
-ready(() => {
-  const React    = require('react');
-  const ReactDOM = require('react-dom');
-
-  [].forEach.call(document.querySelectorAll('[data-admin-component]'), element => {
-    const componentName  = element.getAttribute('data-admin-component');
-    const { locale, ...componentProps } = JSON.parse(element.getAttribute('data-props'));
-
-    import('flavours/glitch/containers/admin_component').then(({ default: AdminComponent }) => {
-      return import('flavours/glitch/components/admin/' + componentName).then(({ default: Component }) => {
-        ReactDOM.render((
-          <AdminComponent locale={locale}>
-            <Component {...componentProps} />
-          </AdminComponent>
-        ), element);
-      });
-    }).catch(error => {
-      console.error(error);
-    });
   });
-});