Fix labels (#40)

Author: cp-sumi-k

admin/src/components/Input.jsx

@@ -13,7 +13,7 @@ const Tags = ({
   attribute,
   description,
   error,
-  intlLabel,
+  label,
   labelAction,
   name,
   onChange,
@@ -176,9 +176,7 @@ const Tags = ({
           style={{ position: "relative" }}
           ref={inputEle}
         >
-          <Field.Label action={labelAction}>
-            {intlLabel && formatMessage({ id: intlLabel })}
-          </Field.Label>
+          {label && <Field.Label action={labelAction}>{formatMessage({ id: label, defaultMessage: "Tags" })}</Field.Label>}
           <ThemeStyle />
           <Flex direction="column">
             <TagsInput
@@ -206,7 +204,7 @@ Tags.defaultProps = {
 };
 
 Tags.propTypes = {
-  intlLabel: PropTypes.object.isRequired,
+  label: PropTypes.object.isRequired,
   onChange: PropTypes.func.isRequired,
   attribute: PropTypes.object.isRequired,
   name: PropTypes.string.isRequired,

admin/src/index.js

@@ -1,4 +1,5 @@
 import pluginId from "./pluginId";
+import { getTranslation } from './utils/getTranslation';
 
 export default {
   register(app) {
@@ -7,12 +8,12 @@ export default {
       pluginId: pluginId,
       type: "text",
       intlLabel: {
-        id: "tagsinput.tag.label",
-        defaultMessage: "TagsInput",
+        id: getTranslation('form.label'),
+        defaultMessage: 'TagsInput',
       },
       intlDescription: {
-        id: "tagsinput.tag.description",
-        defaultMessage: "TagsInput to add custom tags",
+        id: getTranslation('form.description'),
+        defaultMessage: 'TagsInput to add custom tags',
       },
       components: {
         Input: async () =>
@@ -24,13 +25,13 @@ export default {
         base: [
           {
             sectionTitle: {
-              id: "tagsinput.tags.section.apiUrl",
+              id: "form.section.apiUrl",
               defaultMessage: "API Url",
             },
             items: [
               {
                 intlLabel: {
-                  id: "tagsinput.tags.section.apiUrl",
+                  id: "form.apiUrl",
                   defaultMessage: "Rest API URL for suggestions",
                 },
                 name: "options.apiUrl",

admin/src/translations/en.json

@@ -0,0 +1,6 @@
+{
+    "form.label": "TagsInput",
+    "form.description": "TagsInput to add custom tags",
+    "form.section.apiUrl": "API Url",
+    "form.apiUrl": "Rest API URL for suggestions"
+}

admin/src/utils/getTranslation.js

@@ -0,0 +1,5 @@
+import pluginId from '../pluginId';
+
+const getTranslation = (id) => `${pluginId}.${id}`;
+
+export { getTranslation };