diff --git a/src-ui/app/App.jsx b/src-ui/app/App.jsx
index b9b59e6f..b74393d4 100644
--- a/src-ui/app/App.jsx
+++ b/src-ui/app/App.jsx
@@ -145,7 +145,7 @@ const FontFamilyController = () => {
};
import { useStore_SelectableFontFamilyList } from "@store";
-import { arrayToObject } from "@utils/arrayToObject";
+import { arrayToObject } from "@utils";
import { invoke } from "@tauri-apps/api/tauri";
const useAsyncFetchFonts = () => {
diff --git a/src-ui/utils/reset.css b/src-ui/app/_index_css/reset.css
similarity index 100%
rename from src-ui/utils/reset.css
rename to src-ui/app/_index_css/reset.css
diff --git a/src-ui/utils/root.css b/src-ui/app/_index_css/root.css
similarity index 100%
rename from src-ui/utils/root.css
rename to src-ui/app/_index_css/root.css
diff --git a/src-ui/utils/variables.css b/src-ui/app/_index_css/variables.css
similarity index 100%
rename from src-ui/utils/variables.css
rename to src-ui/app/_index_css/variables.css
diff --git a/src-ui/app/config_page/setting_section/setting_box/about_vrct/poster_showcase_contents/poster_showcase_worlds_contents/PosterShowcaseWorldsContents.jsx b/src-ui/app/config_page/setting_section/setting_box/about_vrct/poster_showcase_contents/poster_showcase_worlds_contents/PosterShowcaseWorldsContents.jsx
index 520bff17..abfa7a40 100644
--- a/src-ui/app/config_page/setting_section/setting_box/about_vrct/poster_showcase_contents/poster_showcase_worlds_contents/PosterShowcaseWorldsContents.jsx
+++ b/src-ui/app/config_page/setting_section/setting_box/about_vrct/poster_showcase_contents/poster_showcase_worlds_contents/PosterShowcaseWorldsContents.jsx
@@ -9,7 +9,7 @@ const getImageByFileName = (file_name) => {
};
import poster_showcase_worlds_settings from "./poster_showcase_worlds_settings";
-import { chunkArray } from "@utils/chunkArray";
+import { chunkArray } from "@utils";
export const PosterShowcaseWorldsContents = () => {
const { currentPosterShowcaseWorldPageIndex } = useStore_PosterShowcaseWorldPageIndex();
@@ -57,7 +57,7 @@ export const PosterShowcaseWorldsContents = () => {
import chat_white_square from "@images/chato_white_square.png";
import { useEffect } from "react";
-import { randomIntMinMax } from "@utils/randomIntMinMax";
+import { randomIntMinMax } from "@utils";
const PosterShowcaseWorldsPagination = ({ page_length }) => {
const { currentPosterShowcaseWorldPageIndex, updatePosterShowcaseWorldPageIndex } = useStore_PosterShowcaseWorldPageIndex();
diff --git a/src-ui/app/index.jsx b/src-ui/app/index.jsx
index ab108afa..03c4e13a 100644
--- a/src-ui/app/index.jsx
+++ b/src-ui/app/index.jsx
@@ -1,7 +1,7 @@
import React from "react";
import ReactDOM from "react-dom/client";
import "@root/locales/config.js";
-import "@utils/root.css";
+import "./_index_css/root.css";
import { App } from "./App";
diff --git a/src-ui/app/main_page/main_section/message_container/log_box/LogBox.jsx b/src-ui/app/main_page/main_section/message_container/log_box/LogBox.jsx
index ac886269..b5f24918 100644
--- a/src-ui/app/main_page/main_section/message_container/log_box/LogBox.jsx
+++ b/src-ui/app/main_page/main_section/message_container/log_box/LogBox.jsx
@@ -2,7 +2,7 @@ import { useEffect, useLayoutEffect, useRef, useState } from "react";
import styles from "./LogBox.module.scss";
import { store } from "@store";
import { MessageContainer } from "./message_container/MessageContainer";
-import { scrollToBottom } from "@utils/scrollToBottom";
+import { scrollToBottom } from "@utils";
import { useMessage } from "@logics_common";
export const LogBox = () => {
diff --git a/src-ui/app/main_page/main_section/message_container/message_input_box/MessageInputBox.jsx b/src-ui/app/main_page/main_section/message_container/message_input_box/MessageInputBox.jsx
index 6329f3d1..007c3a67 100644
--- a/src-ui/app/main_page/main_section/message_container/message_input_box/MessageInputBox.jsx
+++ b/src-ui/app/main_page/main_section/message_container/message_input_box/MessageInputBox.jsx
@@ -3,7 +3,7 @@ import styles from "./MessageInputBox.module.scss";
import SendMessageSvg from "@images/send_message.svg?react";
import { useMessage } from "@logics_common";
import { store } from "@store";
-import { scrollToBottom } from "@utils/scrollToBottom";
+import { scrollToBottom } from "@utils";
import {
useSendMessageButtonType,
useEnableAutoClearMessageInputBox,
diff --git a/src-ui/app/main_page/sidebar_section/language_settings/LanguageSettings.jsx b/src-ui/app/main_page/sidebar_section/language_settings/LanguageSettings.jsx
index 03715d9c..a36ce73c 100644
--- a/src-ui/app/main_page/sidebar_section/language_settings/LanguageSettings.jsx
+++ b/src-ui/app/main_page/sidebar_section/language_settings/LanguageSettings.jsx
@@ -66,7 +66,7 @@ const PresetContainer = () => {
title: t("main_page.your_language"),
is_opened: currentIsOpenedLanguageSelector.data.your_language,
onClickFunction: () => toggleSelector("your_language", currentIsOpenedLanguageSelector.data.your_language, updateIsOpenedLanguageSelector),
- TurnedOnSvgComponent: ,
+ TurnedOnSvgComponent: MicSvg,
is_turned_on: currentTranscriptionSendStatus.data,
variable: your_language_data?.primary,
};
@@ -75,7 +75,7 @@ const PresetContainer = () => {
title: t("main_page.target_language"),
is_opened: currentIsOpenedLanguageSelector.data.target_language,
onClickFunction: () => toggleSelector("target_language", currentIsOpenedLanguageSelector.data.target_language, updateIsOpenedLanguageSelector),
- TurnedOnSvgComponent: ,
+ TurnedOnSvgComponent: HeadphonesSvg,
is_turned_on: currentTranscriptionReceiveStatus.data,
variable: target_language_data?.primary,
};
diff --git a/src-ui/app/main_page/sidebar_section/language_settings/language_selector_open_button/LanguageSelectorOpenButton.jsx b/src-ui/app/main_page/sidebar_section/language_settings/language_selector_open_button/LanguageSelectorOpenButton.jsx
index 7d080914..4139c057 100644
--- a/src-ui/app/main_page/sidebar_section/language_settings/language_selector_open_button/LanguageSelectorOpenButton.jsx
+++ b/src-ui/app/main_page/sidebar_section/language_settings/language_selector_open_button/LanguageSelectorOpenButton.jsx
@@ -1,17 +1,14 @@
import clsx from "clsx";
import styles from "./LanguageSelectorOpenButton.module.scss";
import ArrowLeftSvg from "@images/arrow_left.svg?react";
-import { useSvg } from "@utils/useSvg";
export const LanguageSelectorOpenButton = ({ title, onClickFunction, is_opened, TurnedOnSvgComponent, is_turned_on, variable }) => {
- const classNames = clsx(styles.arrow_left_svg, {
+ const arrow_class_names = clsx(styles.arrow_left_svg, {
[styles.reverse]: is_opened,
});
- const SvgComponent = useSvg(TurnedOnSvgComponent, {
- className: clsx(styles.category_svg, {
- [styles.is_turned_on]: is_turned_on,
- }),
+ const category_class_names = clsx(styles.category_svg, {
+ [styles.is_turned_on]: is_turned_on,
});
const languageText = variable?.language ?? "Loading...";
@@ -20,13 +17,13 @@ export const LanguageSelectorOpenButton = ({ title, onClickFunction, is_opened,
return (
- {SvgComponent}
+
{title}
{languageText}
({countryText})
-
+
);
diff --git a/src-ui/app/main_page/sidebar_section/language_settings/translator_selector_open_button/TranslatorSelectorOpenButton.jsx b/src-ui/app/main_page/sidebar_section/language_settings/translator_selector_open_button/TranslatorSelectorOpenButton.jsx
index 1c803415..13708b1c 100644
--- a/src-ui/app/main_page/sidebar_section/language_settings/translator_selector_open_button/TranslatorSelectorOpenButton.jsx
+++ b/src-ui/app/main_page/sidebar_section/language_settings/translator_selector_open_button/TranslatorSelectorOpenButton.jsx
@@ -1,5 +1,5 @@
import { useTranslation } from "react-i18next";
-import { updateLabelsById } from "@utils/updateLabelsById";
+import { updateLabelsById } from "@utils";
import styles from "./TranslatorSelectorOpenButton.module.scss";
import { TranslatorSelector } from "./translator_selector/TranslatorSelector";
import { useStore_IsOpenedTranslatorSelector } from "@store";
diff --git a/src-ui/app/main_page/sidebar_section/language_settings/translator_selector_open_button/translator_selector/TranslatorSelector.jsx b/src-ui/app/main_page/sidebar_section/language_settings/translator_selector_open_button/translator_selector/TranslatorSelector.jsx
index 8ea0f98c..77f945f6 100644
--- a/src-ui/app/main_page/sidebar_section/language_settings/translator_selector_open_button/translator_selector/TranslatorSelector.jsx
+++ b/src-ui/app/main_page/sidebar_section/language_settings/translator_selector_open_button/translator_selector/TranslatorSelector.jsx
@@ -1,6 +1,6 @@
import clsx from "clsx";
import styles from "./TranslatorSelector.module.scss";
-import { chunkArray } from "@utils/chunkArray";
+import { chunkArray } from "@utils";
import { useStore_IsOpenedTranslatorSelector } from "@store";
import { useLanguageSettings } from "@logics_main";
diff --git a/src-ui/utils/mixins.scss b/src-ui/common_css/mixins.scss
similarity index 100%
rename from src-ui/utils/mixins.scss
rename to src-ui/common_css/mixins.scss
diff --git a/src-ui/logics/main/useMessageInputBoxRatio.js b/src-ui/logics/main/useMessageInputBoxRatio.js
index 14d5d57c..466fc02b 100644
--- a/src-ui/logics/main/useMessageInputBoxRatio.js
+++ b/src-ui/logics/main/useMessageInputBoxRatio.js
@@ -1,7 +1,7 @@
import { appWindow } from "@tauri-apps/api/window";
import { useStore_MessageInputBoxRatio } from "@store";
import { useStdoutToPython } from "@logics/useStdoutToPython";
-import { clampMinMax } from "@utils/clampMinMax";
+import { clampMinMax } from "@utils";
export const useMessageInputBoxRatio = () => {
const { asyncStdoutToPython } = useStdoutToPython();
const { currentMessageInputBoxRatio, updateMessageInputBoxRatio } = useStore_MessageInputBoxRatio();
diff --git a/src-ui/logics/useReceiveRoutes.js b/src-ui/logics/useReceiveRoutes.js
index e00effaf..c194062e 100644
--- a/src-ui/logics/useReceiveRoutes.js
+++ b/src-ui/logics/useReceiveRoutes.js
@@ -1,5 +1,5 @@
import { translator_status } from "@ui_configs";
-import { arrayToObject } from "@utils/arrayToObject";
+import { arrayToObject } from "@utils";
import {
useWindow,
diff --git a/src-ui/utils.js b/src-ui/utils.js
new file mode 100644
index 00000000..a2d38fc9
--- /dev/null
+++ b/src-ui/utils.js
@@ -0,0 +1,67 @@
+export const arrayToObject = (array) => {
+ return array.reduce((obj, item) => {
+ obj[item] = item;
+ return obj;
+ }, {});
+};
+
+export const chunkArray = (array, size) => {
+ const chunked = [];
+ for (let i = 0; i < array.length; i += size) {
+ chunked.push(array.slice(i, i + size));
+ }
+ return chunked;
+};
+
+export const clampMinMax = (value, min, max) => {
+ return Math.min(Math.max(value, min), max);
+};
+// console.log(clamp(5, 1, 10)); // 5 (範囲内)
+// console.log(clamp(-3, 0, 10)); // 0 (minより小さい)
+// console.log(clamp(15, 1, 10)); // 10 (maxより大きい)
+// console.log(clamp(7.5, 1, 10)); // 7.5 (範囲内、少数)
+
+export const randomIntMinMax = (min, max) => {
+ if (min === max) return min;
+ if (max === undefined) {
+ max = min;
+ min = 0;
+ }
+ const int = Math.floor(Math.random() * (max - min + 1)) + min;
+ return int;
+};
+
+export const scrollToBottom = (ref, smooth = false) => {
+ const element = ref.current;
+ const scroll_height = element.scrollHeight - element.clientHeight;
+
+ if (smooth) {
+ const duration = 300; // スクロールにかける時間（ミリ秒）
+ const start_time = performance.now();
+ const scroll_top = element.scrollTop;
+
+ const scroll = (current_time) => {
+ const elapsed = current_time - start_time;
+ const progress = Math.min(elapsed / duration, 1);
+ const ease_in_out_quad = (t) => t < 0.5
+ ? 2 * t * t
+ : -1 + (4 - 2 * t) * t;
+ element.scrollTop = scroll_top + (scroll_height - scroll_top) * ease_in_out_quad(progress);
+
+ if (progress < 1) {
+ requestAnimationFrame(scroll);
+ }
+ };
+
+ requestAnimationFrame(scroll);
+ } else {
+ element.scrollTop = scroll_height;
+ }
+};
+
+export const updateLabelsById = (data_array, updates) => {
+ return data_array.map(item => {
+ const update = updates.find(update_item => update_item.id === item.id);
+ return update ? { ...item, label: update.label } : item;
+ });
+};
\ No newline at end of file
diff --git a/src-ui/utils/arrayToObject.js b/src-ui/utils/arrayToObject.js
deleted file mode 100644
index 69e7b597..00000000
--- a/src-ui/utils/arrayToObject.js
+++ /dev/null
@@ -1,6 +0,0 @@
-export const arrayToObject = (array) => {
- return array.reduce((obj, item) => {
- obj[item] = item;
- return obj;
- }, {});
-};
\ No newline at end of file
diff --git a/src-ui/utils/chunkArray.js b/src-ui/utils/chunkArray.js
deleted file mode 100644
index ee3d47cb..00000000
--- a/src-ui/utils/chunkArray.js
+++ /dev/null
@@ -1,7 +0,0 @@
-export const chunkArray = (array, size) => {
- const chunked = [];
- for (let i = 0; i < array.length; i += size) {
- chunked.push(array.slice(i, i + size));
- }
- return chunked;
-};
\ No newline at end of file
diff --git a/src-ui/utils/clampMinMax.js b/src-ui/utils/clampMinMax.js
deleted file mode 100644
index 1eced3f0..00000000
--- a/src-ui/utils/clampMinMax.js
+++ /dev/null
@@ -1,8 +0,0 @@
-export const clampMinMax = (value, min, max) => {
- return Math.min(Math.max(value, min), max);
-};
-
-// console.log(clamp(5, 1, 10)); // 5 (範囲内)
-// console.log(clamp(-3, 0, 10)); // 0 (minより小さい)
-// console.log(clamp(15, 1, 10)); // 10 (maxより大きい)
-// console.log(clamp(7.5, 1, 10)); // 7.5 (範囲内、少数)
\ No newline at end of file
diff --git a/src-ui/utils/randomIntMinMax.js b/src-ui/utils/randomIntMinMax.js
deleted file mode 100644
index f0882ea6..00000000
--- a/src-ui/utils/randomIntMinMax.js
+++ /dev/null
@@ -1,9 +0,0 @@
-export const randomIntMinMax = (min, max) => {
- if (min === max) return min;
- if (max === undefined) {
- max = min;
- min = 0;
- }
- const int = Math.floor(Math.random() * (max - min + 1)) + min;
- return int;
-};
diff --git a/src-ui/utils/scrollToBottom.js b/src-ui/utils/scrollToBottom.js
deleted file mode 100644
index a2cb2a48..00000000
--- a/src-ui/utils/scrollToBottom.js
+++ /dev/null
@@ -1,27 +0,0 @@
-export const scrollToBottom = (ref, smooth = false) => {
- const element = ref.current;
- const scroll_height = element.scrollHeight - element.clientHeight;
-
- if (smooth) {
- const duration = 300; // スクロールにかける時間（ミリ秒）
- const start_time = performance.now();
- const scroll_top = element.scrollTop;
-
- const scroll = (current_time) => {
- const elapsed = current_time - start_time;
- const progress = Math.min(elapsed / duration, 1);
- const ease_in_out_quad = (t) => t < 0.5
- ? 2 * t * t
- : -1 + (4 - 2 * t) * t;
- element.scrollTop = scroll_top + (scroll_height - scroll_top) * ease_in_out_quad(progress);
-
- if (progress < 1) {
- requestAnimationFrame(scroll);
- }
- };
-
- requestAnimationFrame(scroll);
- } else {
- element.scrollTop = scroll_height;
- }
-};
diff --git a/src-ui/utils/updateLabelsById.js b/src-ui/utils/updateLabelsById.js
deleted file mode 100644
index 496adbf8..00000000
--- a/src-ui/utils/updateLabelsById.js
+++ /dev/null
@@ -1,6 +0,0 @@
-export const updateLabelsById = (data_array, updates) => {
- return data_array.map(item => {
- const update = updates.find(update_item => update_item.id === item.id);
- return update ? { ...item, label: update.label } : item;
- });
-};
\ No newline at end of file
diff --git a/src-ui/utils/useSvg.jsx b/src-ui/utils/useSvg.jsx
deleted file mode 100644
index 2da6e814..00000000
--- a/src-ui/utils/useSvg.jsx
+++ /dev/null
@@ -1,9 +0,0 @@
-import React from "react";
-
-export const useSvg = (svg_component, ...props) => {
- const svgWithClass = svg_component
- ? React.cloneElement(svg_component, ...props)
- : null;
-
- return svgWithClass;
-};
\ No newline at end of file
diff --git a/vite.config.js b/vite.config.js
index 4412baeb..a2b46140 100644
--- a/vite.config.js
+++ b/vite.config.js
@@ -36,10 +36,10 @@ export default defineConfig(async () => ({
"@test_data": path.resolve(__dirname, "./test_data.js"),
"@ui_configs": path.resolve(__dirname, "src-ui/ui_configs.js"),
- "@scss_mixins": path.resolve(__dirname, "src-ui/utils/mixins.scss"),
+ "@scss_mixins": path.resolve(__dirname, "src-ui/common_css/mixins.scss"),
"@store": path.resolve(__dirname, "src-ui/store.js"),
"@images": path.resolve(__dirname, "src-ui/assets"),
- "@utils": path.resolve(__dirname, "src-ui/utils"),
+ "@utils": path.resolve(__dirname, "src-ui/utils.js"),
"@logics": path.resolve(__dirname, "src-ui/logics"),
"@logics_common": path.resolve(__dirname, "src-ui/logics/common"),
"@logics_main": path.resolve(__dirname, "src-ui/logics/main"),