feat: additional prefix support

Chia-Network · Sep 7, 2023 · faadf88 · faadf88
1 parent 41229b4
commit faadf88
Show file tree

Hide file tree

Showing 7 changed files with 82 additions and 2 deletions.
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "core-registry-cadt-ui",
-  "version": "1.2.7",
+  "version": "1.2.8",
   "private": true,
   "author": "Chia Network Inc. <[email protected]>",
   "homepage": "./",

diff --git a/src/components/forms/OrgCreateFormModal.js b/src/components/forms/OrgCreateFormModal.js
@@ -40,11 +40,13 @@ const OrgCreateFormModal = ({ onClose }) => {
   const [formData, setFormData] = useState({
     name: '',
     png: null,
+    prefix: '',
   });
   const [importedOrgUid, setImportedOrgUid] = useState('');
   const [tabValue, setTabValue] = useState(0);
 
   const nameIsValid = formData?.name?.length > 0;
+  const prefixIsValid = formData?.prefix?.length > 0;
   const isOrgUidValid = importedOrgUid?.length > 4;
 
   const handleTabChange = (event, newValue) => {
@@ -113,6 +115,33 @@ const OrgCreateFormModal = ({ onClose }) => {
                   </Body>
                 )}
               </StyledFieldContainer>
+              <StyledFieldContainer>
+                <StyledLabelContainer>
+                  <Body>
+                    *<FormattedMessage id="organization-prefix" />
+                  </Body>
+                </StyledLabelContainer>
+                <InputContainer>
+                  <StandardInput
+                    size={InputSizeEnum.large}
+                    variant={InputVariantEnum.default}
+                    value={formData.prefix}
+                    onChange={value =>
+                      setFormData(prevState => ({
+                        ...prevState,
+                        prefix: value,
+                      }))
+                    }
+                  />
+                </InputContainer>
+                {!prefixIsValid && (
+                  <Body size="Small" color="red">
+                    {intl.formatMessage({
+                      id: 'add-valid-organization-prefix',
+                    })}
+                  </Body>
+                )}
+              </StyledFieldContainer>
               <StyledFieldContainer>
                 <StyledLabelContainer>
                   <Body>

diff --git a/src/components/forms/OrgEditFormModal.js b/src/components/forms/OrgEditFormModal.js
@@ -17,12 +17,13 @@ import {
 } from '..';
 import { editExistingOrg } from '../../store/actions/climateWarehouseActions';
 
-const OrgEditFormModal = ({ onClose, name, icon }) => {
+const OrgEditFormModal = ({ onClose, name, prefix, icon }) => {
   const intl = useIntl();
   const dispatch = useDispatch();
   const { notification } = useSelector(state => state.app);
   const [formData, setFormData] = useState({
     name,
+    prefix,
     png: icon,
   });
 
@@ -81,6 +82,33 @@ const OrgEditFormModal = ({ onClose, name, icon }) => {
                 </Body>
               )}
             </StyledFieldContainer>
+            <StyledFieldContainer>
+              <StyledLabelContainer>
+                <Body>
+                  *<FormattedMessage id="organization-prefix" />
+                </Body>
+              </StyledLabelContainer>
+              <InputContainer>
+                <StandardInput
+                  size={InputSizeEnum.large}
+                  variant={InputVariantEnum.default}
+                  value={formData.prefix}
+                  onChange={value =>
+                    setFormData(prevState => ({
+                      ...prevState,
+                      prefix: value,
+                    }))
+                  }
+                />
+              </InputContainer>
+              {!nameIsValid && (
+                <Body size="Small" color="red">
+                  {intl.formatMessage({
+                    id: 'add-valid-organization-prefix',
+                  })}
+                </Body>
+              )}
+            </StyledFieldContainer>
             <StyledFieldContainer>
               <StyledLabelContainer>
                 <Body>

diff --git a/src/pages/Organization/index.js b/src/pages/Organization/index.js
@@ -97,6 +97,23 @@ const Organization = () => {
             </StyledCopyIconContainer>
           </Body>
         </StyledItemContainer>
+        <StyledItemContainer>
+          <Body size="Big Bold">
+            <FormattedMessage id="organization-prefix" />
+          </Body>
+          <Body size="Big">
+            {myOrganization.prefix}
+            <StyledCopyIconContainer>
+              <CopyIcon
+                height={18}
+                width={18}
+                onClick={() => {
+                  navigator.clipboard.writeText(myOrganization.prefix);
+                }}
+              />
+            </StyledCopyIconContainer>
+          </Body>
+        </StyledItemContainer>
         <StyledItemContainer>
           <Body size="Big Bold">
             <FormattedMessage id="org-uid" />
@@ -207,6 +224,7 @@ const Organization = () => {
           onClose={() => setIsEditModalOpen(false)}
           name={myOrganization?.name}
           icon={myOrganization?.icon}
+          prefix={myOrganization?.prefix}
         />
       )}
       {isDeleteModalOpen && (

diff --git a/src/store/actions/climateWarehouseActions.js b/src/store/actions/climateWarehouseActions.js
@@ -1847,6 +1847,7 @@ export const postNewOrg = data => {
       const formData = new FormData();
       formData.append('file', data.png);
       formData.append('name', data.name);
+      formData.append('prefix', data.prefix);
 
       const url = `${constants.API_HOST}/organizations/create`;
       const payload = {
@@ -1896,6 +1897,7 @@ export const editExistingOrg = data => {
       const formData = new FormData();
       formData.append('file', data.png);
       formData.append('name', data.name);
+      formData.append('prefix', data.prefix);
 
       const url = `${constants.API_HOST}/organizations/edit`;
       const payload = {

diff --git a/src/store/validations/organization.validation.js b/src/store/validations/organization.validation.js
@@ -3,6 +3,7 @@ import { validateUrl } from '../../utils/urlUtils';
 
 export const organizationSchema = yup.object().shape({
   name: yup.string().required('Required Field'),
+  prefix: yup.string().optional(),
   icon: yup
     .string()
     .test({

diff --git a/src/translations/tokens/en-US.json b/src/translations/tokens/en-US.json
@@ -293,6 +293,7 @@
   "create-organization": "Create Organization",
   "you-need-to-create-organization": "You need to create your Organization to have full access to the Registry.",
   "organization-name": "Organization Name",
+  "organization-prefix": "Organization Prefix",
   "organization-icon": "Organization Icon",
   "organization-website": "Organization Website",
   "organization-created": "Your organization was successfully added.",
@@ -327,6 +328,7 @@
   "add-valid-server-address": "Add a valid server address",
   "add-valid-api-key": "Add a valid Api key",
   "add-valid-organization-name": "Add a valid organization name",
+  "add-valid-organization-prefix": "Add a valid organization prefix",
   "project-one": "Project 1",
   "project-two": "Project 2",
   "first-project": "First Project",