calcModeをApp.tsxで設定せず、Calculator.tsx内で完結するように修正

st-func · Apr 10, 2024 · fa120f9 · fa120f9
1 parent a98a38f
commit fa120f9
Show file tree

Hide file tree

Showing 2 changed files with 3 additions and 14 deletions.
diff --git a/src/App.tsx b/src/App.tsx
@@ -6,8 +6,6 @@ import Home from "./Home";
 import Calculator from "./Calculator";
 
 const App: React.FC = () => {
-  const [calcMode, setCalcMode] = useState<"buildBox" | "flatBar">("flatBar");
-
   return (
     <Router basename="/st-func-web">
       <div>
@@ -24,12 +22,7 @@ const App: React.FC = () => {
 
         <Routes>
           <Route path="/" element={<Home />} />
-          <Route
-            path="/calc"
-            element={
-              <Calculator calcMode={calcMode} setCalcMode={setCalcMode} />
-            }
-          />
+          <Route path="/calc" element={<Calculator />} />
         </Routes>
       </div>
     </Router>

diff --git a/src/Calculator.tsx b/src/Calculator.tsx
@@ -2,12 +2,8 @@ import React, { useState } from "react";
 import { SecBuildBox, SecFlatBar, SecSteel } from "@st-func/st-func-ts";
 import { Unit } from "@st-func/st-func-ts";
 
-interface CalculatorProps {
-  calcMode: "buildBox" | "flatBar";
-  setCalcMode: React.Dispatch<React.SetStateAction<"buildBox" | "flatBar">>;
-}
-
-const Calculator: React.FC<CalculatorProps> = ({ calcMode, setCalcMode }) => {
+const Calculator: React.FC = () => {
+  const [calcMode, setCalcMode] = useState<"buildBox" | "flatBar">("flatBar");
   const [num1, setNum1] = useState("");
   const [num2, setNum2] = useState("");
   const [num3, setNum3] = useState("");