Merge pull request #789 from cam-inc/develop

Release App 2.11.5

packages/app/CHANGELOG.md

@@ -1,5 +1,14 @@
 # @viron/app
 
+## 2.11.5
+
+### Patch Changes
+
+- 3c66431c: align the label inside the button to the left
+- 1d4039dc: align the label inside the button to the left
+- 9d73d6a5: fixed localization leaks
+- e7ec4bef: add padding to input form
+
 ## 2.11.4
 
 ### Patch Changes

packages/app/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@viron/app",
-  "version": "2.11.4",
+  "version": "2.11.5",
   "engines": {
     "node": ">=18.14.0",
     "npm": ">=9.3.1"

packages/app/src/components/numberinput/index.tsx

@@ -28,7 +28,7 @@ const Numberinput: React.FC<Props> = ({
     type: 'number',
     step: isFloat ? 'any' : '1',
     className: classnames(
-      'block w-full p-1 border rounded focus:outline-none focus:ring-2',
+      'block w-full p-3 border rounded focus:outline-none focus:ring-2',
       `border-thm-on-${on}-faint bg-thm-${on} text-thm-on-${on} focus:bg-thm-on-${on}-faint focus:text-thm-on-${on} focus:ring-thm-on-${on}`
     ),
   };

packages/app/src/components/request/index.tsx

@@ -9,6 +9,7 @@ import ChevronRightIcon from '~/components/icon/chevronRight/outline';
 import Operation from '~/components/operation';
 import Schema from '~/components/schema';
 import { useEliminate } from '~/components/schema/hooks';
+import { useTranslation } from '~/hooks/i18n';
 import { COLOR_SYSTEM, Endpoint } from '~/types/index';
 import {
   Document,
@@ -51,6 +52,7 @@ const _Request: React.FC<Props> = ({
     defaultValues,
   });
   const { ref, execute } = useEliminate();
+  const { t } = useTranslation();
   const _handleSubmit = useMemo(
     () =>
       handleSubmit((data) => {
@@ -191,7 +193,7 @@ const _Request: React.FC<Props> = ({
             type="submit"
             cs={COLOR_SYSTEM.PRIMARY}
             size={BUTTON_SIZE.BASE}
-            label="Submit"
+            label={t('submitButtonLabel')}
             onClick={handleSubmitClick}
           />
         </div>

packages/app/src/components/schema/types/array/index.tsx

@@ -11,6 +11,7 @@ import { getDefaultValue } from '~/utils/oas';
 import { getRegisterOptions } from '~/utils/oas/v8n';
 import { useNameForError } from '../../hooks';
 import { Props } from '../../index';
+import { useTranslation } from '~/hooks/i18n';
 
 // Functions like `append` from useFieldArray accepts argument of type object only.
 // Use `setValue` to append data of type other than object.
@@ -35,6 +36,8 @@ const SchemaOfTypeArray: React.FC<Props> = ({
 }) => {
   const data: any[] | undefined = getValues(name);
   const nameForError = useNameForError({ schema, name });
+  const { t } = useTranslation();
+
   useEffect(() => {
     if (!isDeepActive) {
       clearErrors(nameForError);
@@ -107,7 +110,7 @@ const SchemaOfTypeArray: React.FC<Props> = ({
           on={on}
           size={BUTTON_SIZE.XS}
           Icon={PlusIcon}
-          label="Prepend"
+          label={t('prependButtonLabel')}
           onClick={handlePrependClick}
         />
       )}
@@ -140,7 +143,7 @@ const SchemaOfTypeArray: React.FC<Props> = ({
                 size={BUTTON_SIZE.XS}
                 data={index}
                 Icon={MinusIcon}
-                label="Remove"
+                label={t('removeButtonLabel')}
                 onClick={handleRemoveClick}
               />
             )}
@@ -153,7 +156,7 @@ const SchemaOfTypeArray: React.FC<Props> = ({
               size={BUTTON_SIZE.XS}
               data={index + 1}
               Icon={PlusIcon}
-              label="Insert"
+              label={t('insertButtonLabel')}
               onClick={handleInsertClick}
             />
           )}
@@ -165,7 +168,7 @@ const SchemaOfTypeArray: React.FC<Props> = ({
         on={on}
         size={BUTTON_SIZE.XS}
         Icon={PlusIcon}
-        label="Append"
+        label={t('appendButtonLabel')}
         onClick={handleAppendClick}
       />
     </div>

packages/app/src/components/select/index.tsx

@@ -36,7 +36,7 @@ const _Select = function <T = unknown>({
       <Select
         id={id}
         className={classnames(
-          'block w-full p-1 border rounded focus:outline-none focus:ring-2',
+          'block w-full p-3 border rounded-lg focus:outline-none focus:ring-2',
           `border-thm-on-${on}-low bg-thm-${on} text-thm-on-${on} hover:bg-thm-on-${on}-faint focus:bg-thm-on-${on}-faint focus:text-thm-on-${on} focus:ring-thm-on-${on}`
         )}
       >

packages/app/src/components/textarea/index.tsx

@@ -26,7 +26,7 @@ const Textarea: React.FC<Props> = ({
 }) => {
   const bind: Bind = {
     className: classnames(
-      'block w-full p-1 border rounded focus:outline-none focus:ring-2',
+      'block w-full p-3 border rounded focus:outline-none focus:ring-2',
       `border-thm-on-${on}-faint bg-thm-${on} text-thm-on-${on} focus:bg-thm-on-${on}-faint focus:text-thm-on-${on}  focus:ring-thm-on-${on}`
     ),
   };

packages/app/src/components/textinput/index.tsx

@@ -46,7 +46,7 @@ const Textinput: React.FC<Props> & { renewal: React.FC<RenewalProps> } = ({
   const bind: Bind = {
     type,
     id,
-    className: `block w-full p-1 border rounded border-thm-on-${on}-low bg-thm-${on} text-thm-on-${on} hover:bg-thm-on-${on}-faint focus:outline-none focus:ring-2 focus:bg-thm-on-${on}-faint focus:ring-thm-on-${on}`,
+    className: `block w-full p-3 border rounded-lg border-thm-on-${on}-low bg-thm-${on} text-thm-on-${on} hover:bg-thm-on-${on}-faint focus:outline-none focus:ring-2 focus:bg-thm-on-${on}-faint focus:ring-thm-on-${on}`,
   };
   if (autocompleteId) {
     bind.list = autocompleteId;

packages/app/src/locales/en/common.json

@@ -20,6 +20,17 @@
   "endpoints": "Endpoints",
   "group": "Group",
   "groups": "Groups",
+  "createGroup":{
+    "head":{
+      "title":"Create a Group",
+      "description":"Manage endpoints in groups"
+    },
+    "idFormLabel":"ID",
+    "nameFormLabel":"Name",
+    "descriptionFormLabel":"description",
+    "addButtonLabel":"Add",
+    "cancelButtonLabel":"Cancel"
+  },
   "endpointsTabLabel": "$t(endpoints)",
   "groupsTabLabel": "$t(groups)",
   "dashboard": {
@@ -67,5 +78,10 @@
     "endpoints": "Endpoints",
     "groups": "Groups",
     "dashboard": "Dashboard"
-  }
+  },
+  "prependButtonLabel":"Prepend",
+  "insertButtonLabel":"Insert",
+  "appendButtonLabel":"Append",
+  "removeButtonLabel":"Remove",
+  "submitButtonLabel":"Submit"
 }

packages/app/src/locales/ja/common.json

@@ -20,6 +20,17 @@
   "endpoints": "管理画面",
   "group": "グループ",
   "groups": "グループ",
+  "createGroup":{
+    "head":{
+      "title":"グループの作成",
+      "description":"エンドポイントをグループで管理します"
+    },
+    "idFormLabel":"ID",
+    "nameFormLabel":"グループ名",
+    "descriptionFormLabel":"説明",
+    "addButtonLabel":"追加",
+    "cancelButtonLabel":"キャンセル"
+  },
   "endpointsTabLabel": "$t(endpoints)",
   "groupsTabLabel": "$t(groups)",
   "dashboard": {
@@ -67,5 +78,10 @@
     "endpoints": "管理画面",
     "groups": "グループ",
     "dashboard": "ダッシュボード"
-  }
+  },
+  "prependButtonLabel":"先頭に追加",
+  "insertButtonLabel":"挿入",
+  "appendButtonLabel":"追加",
+  "removeButtonLabel":"削除",
+  "submitButtonLabel":"更新"
 }

packages/app/src/pages/dashboard/_/menu/index.tsx

@@ -26,12 +26,12 @@ const Menu: React.FC<Props> = ({ className }) => {
       </div>
       {/* Menu */}
       <Popover.renewal {...menuPopover.bind}>
-        <ul className="flex flex-col gap-2">
+        <ul className="space-y-2">
           <li>
-            <Import className="w-full" />
+            <Import />
           </li>
           <li>
-            <Export className="w-full" />
+            <Export />
           </li>
         </ul>
       </Popover.renewal>