ヘルプへのリンクを追加

Author: su-u

package.json

@@ -14,6 +14,7 @@
     "release-patch": "yarn version --patch"
   },
   "dependencies": {
+    "@ant-design/icons": "^5.5.1",
     "@codemirror/lang-json": "^6.0.1",
     "@emotion/react": "^11.13.3",
     "@emotion/styled": "^11.13.0",

src/app/datetime_converter/DateConverter.tsx

@@ -2,6 +2,7 @@
 import React, { FC } from 'react';
 import { Controller } from 'react-hook-form';
 import { Col, Grid, Panel, PanelGroup, Row, Form } from 'rsuite';
+import { QuestionCircleOutlined } from '@ant-design/icons';
 import { AppLayout } from '@/Layout/App';
 import { useDateConverter } from '@/app/datetime_converter/useDateConverter';
 import { DatePicker } from '@/components/common/Form/DatePicker';
@@ -77,7 +78,21 @@ export const DateTimeConverter: FC = () => {
                       control={control}
                     />
                   </FormRow>
-                  <FormRow label="カスタム出力">
+                  <FormRow
+                    label={
+                      <>
+                        カスタム出力
+                        <a
+                          href="https://day.js.org/docs/en/display/format"
+                          target="_blank"
+                          rel="noopener noreferrer"
+                          style={{ marginLeft: '4px' }}
+                        >
+                          <QuestionCircleOutlined />
+                        </a>
+                      </>
+                    }
+                  >
                     <Controller
                       render={() => (
                         <Input style={{ width }} noResize="none" onChange={onChangeCustomFormat} />

src/components/common/Form/FormRow.tsx

@@ -3,8 +3,8 @@ import { Form, Grid, Row, Col } from 'rsuite';
 import { FormLabel } from '@/components/common/Form/FormLabel';
 
 type Props = {
-  label: string;
-  children: React.ReactNode;
+  label: React.ReactNode;
+  children?: React.ReactNode;
 };
 
 export const FormRow: FC<Props> = ({ label, children, ...rest }) => {

yarn.lock

@@ -67,6 +67,17 @@
     classnames "^2.2.6"
     rc-util "^5.31.1"
 
+"@ant-design/icons@^5.5.1":
+  version "5.5.1"
+  resolved "https://registry.yarnpkg.com/@ant-design/icons/-/icons-5.5.1.tgz#4ff57b2a0d3bafae3d990c2781fd857ead36c935"
+  integrity sha512-0UrM02MA2iDIgvLatWrj6YTCYe0F/cwXvVE0E2SqGrL7PZireQwgEKTKBisWpZyal5eXZLvuM98kju6YtYne8w==
+  dependencies:
+    "@ant-design/colors" "^7.0.0"
+    "@ant-design/icons-svg" "^4.4.0"
+    "@babel/runtime" "^7.24.8"
+    classnames "^2.2.6"
+    rc-util "^5.31.1"
+
 "@ant-design/react-slick@~1.1.2":
   version "1.1.2"
   resolved "https://registry.yarnpkg.com/@ant-design/react-slick/-/react-slick-1.1.2.tgz#f84ce3e4d0dc941f02b16f1d1d6d7a371ffbb4f1"