Support units in metadata schemas and display them

EUDAT-B2SHARE · Jan 8, 2021 · 58e57ed · 58e57ed
1 parent 8f63e8b
commit 58e57ed
Show file tree

Hide file tree

Showing 3 changed files with 25 additions and 18 deletions.
diff --git a/webui/src/components/editrecord.jsx b/webui/src/components/editrecord.jsx
@@ -384,8 +384,16 @@ const EditRecord = React.createClass({
                 <div key={id} style={{marginBottom:'0.5em'}} title={schema.get('description')}>
                     {!title ? false :
                         <label htmlFor={id} className="col-sm-3 control-label" style={{fontWeight:'bold'}}>
-                            <span style={{float:'right', color:isError?'red':'black'}}>
-                                {title} {schema.get('isRequired') ? "*":""}
+                            <span style={{float:'right'}}>
+                                <span style={{color:isError?'red':'black'}}>
+                                    {title}&nbsp;
+                                </span>
+                                <span>
+                                    {schema.get('unit') ? <span style={{color: 'grey'}}> {'(' + schema.get('unit') + ')'} </span> : false }
+                                </span>
+                                <span>
+                                    {schema.get('isRequired') ? "*" : ""}&nbsp;
+                                </span>
                             </span>
                         </label> }
                     <div className={title ? "col-sm-9":"col-sm-12"} style={arrstyle} onFocus={onfocus} onBlur={onblur}>

diff --git a/webui/src/components/record.jsx b/webui/src/components/record.jsx
@@ -445,7 +445,9 @@ const Record = React.createClass({
                 }
                 <div className={
                     (title ? "col-sm-8" : "col-sm-12") + " " + (type === 'object' ? "metadata-object" : "metadata")}>
-                     {inner} </div>
+                     {inner}
+                     {schema.get('unit') ? <span style={{color: 'grey'}}>  { schema.get('unit') } </span> : false }
+                </div>
             </li>
         );
     },

diff --git a/webui/src/components/schema.jsx b/webui/src/components/schema.jsx
@@ -67,23 +67,20 @@ export const Schema = React.createClass({
             inner = <span className="mono-style">{inner}</span>
         }
 
-        const leftcolumn = !id ? false :
-            <div className="col-sm-6">
-                <p className={requiredClass}>
-                    <span className="bold">{title}</span>
-                    <span className="mono-style">
-                        {title?" :: ":""}
-                        {id}
-                        {schema.get('isRequired') ? " (required)":false}
-                    </span>
-                </p>
-                <p> {schema.get('description')} </p>
-            </div>;
-        const rightcolumnsize = leftcolumn ? "col-sm-6" : "col-sm-12";
         return (
             <li key={id} className="row field-general">
-                {leftcolumn}
-                <div className={rightcolumnsize}> {inner} </div>
+                <div className="col-sm-6">
+                    <p className={requiredClass}>
+                        <span className="bold">{title} {schema.get('unit') ? ' [' + schema.get('unit') + ']' : false }</span>
+                        <span className="mono-style">
+                            {title ? " :: " : ""}
+                            {id}
+                            {schema.get('isRequired') ? " (required)" : false}
+                        </span>
+                    </p>
+                    <p> {schema.get('description')} </p>
+                </div>
+                <div className="col-sm-6"> {inner} </div>
             </li>
         );
     },