🚧 [components] Work on draft/pattern settings/options

packages/components/src/PatternOptionList/index.js

@@ -29,6 +29,15 @@ const PatternOptionList = props => {
     right: { margin: "0 0.5rem" }
   };
 
+  // Add translations
+  let stringKey = `options.${props.pattern}.${props.name}.options.`;
+  let list = {};
+  for (let item of props.list)
+    list[item] = props.intl.formatMessage({
+      id: stringKey + item,
+      defaultMessage: item
+    });
+
   return (
     <div className={"pattern-option list"}>
       <OptionPreamble
@@ -37,7 +46,7 @@ const PatternOptionList = props => {
         desc={props.desc}
         title={props.title}
         id={"po-list-" + props.name}
-        displayValue={props.list[value]}
+        displayValue={list[value]}
         reset={reset}
         showHelp={() =>
           props.triggerAction("showHelp", {
@@ -53,7 +62,7 @@ const PatternOptionList = props => {
         onChange={update}
         label={"po-list-" + props.name}
         updateValue={update}
-        list={props.list}
+        list={list}
       />
     </div>
   );
@@ -66,16 +75,9 @@ PatternOptionList.propTypes = {
     PropTypes.number.isRequired,
     PropTypes.string.isRequired
   ]),
-  title: PropTypes.string.isRequired,
-  desc: PropTypes.string.isRequired,
-  resetLabel: PropTypes.string,
-  docsLabel: PropTypes.string,
-  list: PropTypes.object.isRequired
-};
-
-PatternOptionList.defaultProps = {
-  title: false,
-  desc: false
+  title: PropTypes.node.isRequired,
+  desc: PropTypes.node.isRequired,
+  list: PropTypes.array.isRequired
 };
 
 export default PatternOptionList;