From 4eca60d495731f8f3bde843c6cca04b80a762bb5 Mon Sep 17 00:00:00 2001
From: Sakamoto Shiina <68018796+ShiinaSakamoto@users.noreply.github.com>
Date: Sat, 19 Apr 2025 23:51:47 +0900
Subject: [PATCH] [bugfix] AdvancedSettings: OSC Port: Add the validation that
 the entry component is only allowed numeric.

---
 .../advanced_settings/AdvancedSettings.jsx          | 13 +++++++------
 1 file changed, 7 insertions(+), 6 deletions(-)

diff --git a/src-ui/app/config_page/setting_section/setting_box/advanced_settings/AdvancedSettings.jsx b/src-ui/app/config_page/setting_section/setting_box/advanced_settings/AdvancedSettings.jsx
index 966a3c21..b96c7fa9 100644
--- a/src-ui/app/config_page/setting_section/setting_box/advanced_settings/AdvancedSettings.jsx
+++ b/src-ui/app/config_page/setting_section/setting_box/advanced_settings/AdvancedSettings.jsx
@@ -32,10 +32,10 @@ export const AdvancedSettings = () => {
 const OscIpAddressContainer = () => {
     const { t } = useTranslation();
     const { currentOscIpAddress, setOscIpAddress } = useOscIpAddress();
-    const [input_value, seInputValue] = useState(currentOscIpAddress.data);
+    const [input_value, setInputValue] = useState(currentOscIpAddress.data);
 
     const onChangeFunction = (value) => {
-        seInputValue(value);
+        setInputValue(value);
     };
 
     const saveFunction = () => {
@@ -43,7 +43,7 @@ const OscIpAddressContainer = () => {
     };
 
     useEffect(()=> {
-        seInputValue(currentOscIpAddress.data);
+        setInputValue(currentOscIpAddress.data);
     }, [currentOscIpAddress]);
 
     return (
@@ -61,10 +61,11 @@ const OscIpAddressContainer = () => {
 const OscPortContainer = () => {
     const { t } = useTranslation();
     const { currentOscPort, setOscPort } = useOscPort();
-    const [input_value, seInputValue] = useState(currentOscPort.data);
+    const [input_value, setInputValue] = useState(currentOscPort.data);
 
     const onChangeFunction = (value) => {
-        seInputValue(value);
+        value = value.replace(/[^0-9]/g, "");
+        setInputValue(value);
     };
 
     const saveFunction = () => {
@@ -72,7 +73,7 @@ const OscPortContainer = () => {
     };
 
     useEffect(()=> {
-        seInputValue(currentOscPort.data);
+        setInputValue(currentOscPort.data);
     }, [currentOscPort]);
 
     return (