From 2f26d12f6ac5d1a7c91da327c4300e0325928b47 Mon Sep 17 00:00:00 2001
From: 1ilit <1ilit@proton.me>
Date: Wed, 7 Aug 2024 23:00:19 +0300
Subject: [PATCH] Make language modal wider

---
 src/components/EditorHeader/Modal/Language.jsx |  2 +-
 src/components/EditorHeader/Modal/Modal.jsx    |  8 ++++++--
 src/utils/{modalTitles.js => modalData.js}     | 11 +++++++++++
 3 files changed, 18 insertions(+), 3 deletions(-)
 rename src/utils/{modalTitles.js => modalData.js} (87%)

diff --git a/src/components/EditorHeader/Modal/Language.jsx b/src/components/EditorHeader/Modal/Language.jsx
index e924fcb..2c9cbc3 100644
--- a/src/components/EditorHeader/Modal/Language.jsx
+++ b/src/components/EditorHeader/Modal/Language.jsx
@@ -7,7 +7,7 @@ export default function Language() {
   const { i18n } = useTranslation();
 
   return (
-    <div className="grid grid-cols-3 gap-4">
+    <div className="grid grid-cols-4 md:grid-cols-2 gap-4">
       {languages.map((l) => (
         <button
           key={l.code}
diff --git a/src/components/EditorHeader/Modal/Modal.jsx b/src/components/EditorHeader/Modal/Modal.jsx
index 33358ef..af0d78e 100644
--- a/src/components/EditorHeader/Modal/Modal.jsx
+++ b/src/components/EditorHeader/Modal/Modal.jsx
@@ -21,7 +21,11 @@ import {
 } from "../../../hooks";
 import { saveAs } from "file-saver";
 import { Parser } from "node-sql-parser";
-import { getModalTitle, getOkText } from "../../../utils/modalTitles";
+import {
+  getModalTitle,
+  getModalWidth,
+  getOkText,
+} from "../../../utils/modalData";
 import Rename from "./Rename";
 import Open from "./Open";
 import New from "./New";
@@ -363,7 +367,7 @@ export default function Modal({
           (modal === MODAL.IMPORT_SRC && importSource.src === ""),
       }}
       cancelText={t("cancel")}
-      width={modal === MODAL.NEW || modal === MODAL.OPEN ? 740 : 600}
+      width={getModalWidth(modal)}
       bodyStyle={{
         maxHeight: window.innerHeight - 280,
         overflow: "auto",
diff --git a/src/utils/modalTitles.js b/src/utils/modalData.js
similarity index 87%
rename from src/utils/modalTitles.js
rename to src/utils/modalData.js
index 168f9d3..d72ba6e 100644
--- a/src/utils/modalTitles.js
+++ b/src/utils/modalData.js
@@ -28,6 +28,17 @@ export const getModalTitle = (modal) => {
   }
 };
 
+export const getModalWidth = (modal) => {
+  switch (modal) {
+    case MODAL.LANGUAGE:
+    case MODAL.OPEN:
+    case MODAL.NEW:
+      return 740;
+    default:
+      return 600;
+  }
+};
+
 export const getOkText = (modal) => {
   switch (modal) {
     case MODAL.IMPORT: