シラバスデータをdataに移動

src/App.tsx

@@ -6,8 +6,8 @@ import {
     // initializeSubject, subjectCodeList,
     initializeSubject,
 } from './subject';
-import SyllabusTable from './subject/SyllabusTable';
-import SyllabusTableRaw from './subject/SyllabusTableRaw';
+import SyllabusTable from './table-view/SyllabusTable';
+import SyllabusTableRaw from './table-view/SyllabusTableRaw';
 // import { numberOfSubjectsToShow } from './subject/SyllabusTable';
 
 

src/subject/SearchComponent.tsx

@@ -0,0 +1,41 @@
+import React, { useState } from 'react';
+
+type SearchComponentProps = {
+    onSearch: (term: string, checkbox: boolean) => void;
+};
+
+const SearchComponent: React.FC<SearchComponentProps> = ({ onSearch }) => {
+    const [searchTerm, setSearchTerm] = useState('');
+    const [checkboxValue, setCheckboxValue] = useState(false);
+
+    const handleSearchChange = (e: React.ChangeEvent<HTMLInputElement>) => {
+        setSearchTerm(e.target.value);
+    };
+
+    const handleCheckboxChange = (e: React.ChangeEvent<HTMLInputElement>) => {
+        setCheckboxValue(e.target.checked);
+    };
+
+    const handleSearch = () => {
+        onSearch(searchTerm, checkboxValue);
+    };
+
+    return (
+        <div>
+            <input
+                type="text"
+                value={searchTerm}
+                onChange={handleSearchChange}
+                placeholder="検索..."
+            />
+            <input
+                type="checkbox"
+                checked={checkboxValue}
+                onChange={handleCheckboxChange}
+            />
+            <button onClick={handleSearch}>検索</button>
+        </div>
+    );
+};
+
+export default SearchComponent;

src/subject/index.ts

@@ -1,6 +1,6 @@
 // import { Periods } from './period';
 
-import subjectData from '../../subject-maininfo.json'
+import subjectData from '../../data/subject-maininfo.json'
 
 export interface kaisetsuki {
   rishuNenji: number

src/subject/SyllabusTable.tsx → src/table-view/SyllabusTable.tsx

@@ -4,10 +4,10 @@ import {
     subjectCodeList,
     subjectMap,
     // propertyToShowList,
-} from './';
+} from '../subject';
 
 import './SyllabusTable.css';
-import { SearchOptions } from './search';
+import { SearchOptions } from '../subject/search';
 
 const fillteredSubjectCodeList = (options: SearchOptions) => {
     return subjectCodeList.filter((subjectCode) =>

src/subject/SyllabusTableRaw.tsx → src/table-view/SyllabusTableRaw.tsx

@@ -5,10 +5,10 @@ import {
     subjectCodeList,
     subjectMap,
     propertyToShowList,
-} from '.';
+} from '../subject';
 
 import './SyllabusTable.css';
-import { SearchOptions } from './search';
+import { SearchOptions } from '../subject/search';
 
 // TODO 要実装
 // reactなら元データsearch option 変えるだけでできるんじゃね