フォーマットとタイトルを変更

Author: su-u

src/app/date_converter/DateConverter.tsx …app/datetime_converter/DateConverter.tsxsrc/app/date_converter/DateConverter.tsx renamed to src/app/datetime_converter/DateConverter.tsx src/app/date_converter/DateConverter.tsx renamed to src/app/datetime_converter/DateConverter.tsx

@@ -3,7 +3,7 @@ import React, { FC } from 'react';
 import { Controller } from 'react-hook-form';
 import { Col, Grid, Panel, PanelGroup, Row, Form } from 'rsuite';
 import { AppLayout } from '@/Layout/App';
-import { useDateConverter } from '@/app/date_converter/useDateConverter';
+import { useDateConverter } from '@/app/datetime_converter/useDateConverter';
 import { DatePicker } from '@/components/common/Form/DatePicker';
 import { FormRow } from '@/components/common/Form/FormRow';
 import { HorizontalForm } from '@/components/common/Form/HorizontalForm';
@@ -15,8 +15,8 @@ import { PanelHeader } from '@/components/common/PanelHeader';
 
 const width = 300;
 
-export const DateConverter: FC = () => {
-  const title = '日時の変換';
+export const DateTimeConverter: FC = () => {
+  const title = '日時->日時変換';
   const {
     methods,
     control,
@@ -38,7 +38,7 @@ export const DateConverter: FC = () => {
             <PanelGroup bordered>
               <Panel bordered header={<PanelHeader title="入力" />}>
                 <Form fluid layout="horizontal">
-                  <FormRow label="日付">
+                  <FormRow label="日時">
                     <Controller
                       render={() => <DatePicker style={{ width }} onChange={onChangeInputDate} />}
                       name="inputDate"
@@ -47,7 +47,7 @@ export const DateConverter: FC = () => {
                   </FormRow>
                   <FormRow label="unixtime">
                     <Controller
-                      render={({ field }) => (
+                      render={() => (
                         <Input
                           style={{ width }}
                           onChange={onChangeInputUnixTime}
@@ -64,7 +64,7 @@ export const DateConverter: FC = () => {
                 <Form fluid layout="horizontal">
                   <FormRow label="TimeZone">
                     <Controller
-                      render={({ field }) => (
+                      render={() => (
                         <Select
                           style={{ width }}
                           options={timezones}

src/app/date_converter/page.tsx src/app/datetime_converter/page.tsxsrc/app/date_converter/page.tsx renamed to src/app/datetime_converter/page.tsx

@@ -1,12 +1,12 @@
 import React, { FC } from 'react';
-import { DateConverter } from '@/app/date_converter/DateConverter';
+import { DateTimeConverter } from '@/app/datetime_converter/DateConverter';
 
 export const metadata = {
   title: 'Dev Toolkit - 日時の変換',
 };
 
 const DateConverterPage: FC = () => {
-  return <DateConverter />;
+  return <DateTimeConverter />;
 };
 
 export default DateConverterPage;

…c/app/date_converter/useDateConverter.ts …p/datetime_converter/useDateConverter.tssrc/app/date_converter/useDateConverter.ts renamed to src/app/datetime_converter/useDateConverter.ts src/app/date_converter/useDateConverter.ts renamed to src/app/datetime_converter/useDateConverter.ts

@@ -1,5 +1,5 @@
 import { Dayjs } from 'dayjs';
-import { useMemo, useEffect, useCallback, useState, ChangeEventHandler, ChangeEvent } from 'react';
+import { useMemo, useEffect, useCallback, useState, ChangeEvent } from 'react';
 import TIME_ZONES from 'timezones-list';
 import { useCustomForm } from '@/components/common/Form/useCustomForm';
 import { dayjs } from '@/lib/dayjs';

src/components/common/Features.tsx

@@ -1,6 +1,7 @@
 import EditIcon from '@rsuite/icons/Edit';
 import GrowthIcon from '@rsuite/icons/Growth';
 import ListOl from '@rsuite/icons/legacy/ListOl';
+import TimeIcon from '@rsuite/icons/Time';
 import React from 'react';
 
 export type FeatureItemType = {
@@ -91,11 +92,18 @@ export const features: FeatureGroupType[] = [
         title: '数字カンマ区切り',
         path: '/number_comma',
       },
+    ],
+  },
+  {
+    title: '時間ツール',
+    icon: <TimeIcon />,
+    key: '4',
+    items: [
       {
         key: 'date_converter',
-        title: '日時の変換',
-        path: '/date_converter',
-        description: '日付のフォーマットを変換します',
+        title: '日時->日時変換',
+        path: '/datetime_converter',
+        description: '日時のフォーマットを変換します',
       },
       {
         key: 'date_diff',
@@ -108,7 +116,7 @@ export const features: FeatureGroupType[] = [
   {
     title: '生成ツール',
     icon: <GrowthIcon />,
-    key: '4',
+    key: '5',
     items: [
       {
         key: 'hash',