feat: Custom row feature implemented

splunk · Mar 31, 2021 · 308d847 · 308d847
1 parent 34d19bd
commit 308d847
Show file tree

Hide file tree

Showing 19 changed files with 976 additions and 414 deletions.
diff --git a/splunk_add_on_ucc_framework/ucc_ui_lib/design_changes.patch b/splunk_add_on_ucc_framework/ucc_ui_lib/design_changes.patch
diff --git a/...k_add_on_ucc_framework/ucc_ui_lib/src/main/resources/splunk/appserver/templates/base.html b/...k_add_on_ucc_framework/ucc_ui_lib/src/main/resources/splunk/appserver/templates/base.html
@@ -1,31 +1,24 @@
-<%!
-app_name = cherrypy.request.path_info.split('/')[3]
-
-%>\
-<!doctype html>
+<%! app_name = cherrypy.request.path_info.split('/')[3] %>\
+<!DOCTYPE html>
 <html class="no-js" lang="">
+    <head>
+        <meta charset="utf-8" />
+        <meta http-equiv="x-ua-compatible" content="ie=edge" />
+        <title>${_('Loading')}</title>
+        <meta name="viewport" content="width=device-width, initial-scale=1" />
+        <link rel="apple-touch-icon" href="apple-touch-icon.png" />
+    </head>
 
-<head>
-    <meta charset="utf-8">
-    <meta http-equiv="x-ua-compatible" content="ie=edge">
-    <title>${_('Loading')}</title>
-    <meta name="viewport" content="width=device-width, initial-scale=1">
-    <link rel="apple-touch-icon" href="apple-touch-icon.png">
-</head>
-
-<body style="min-width:960px">
-    <script src="${make_url('/config?autoload=1')}" crossorigin="use-credentials"></script>
-    <script src="${make_url('/static/js/i18n.js')}"></script>
-    <script src="${make_url('/i18ncatalog?autoload=1')}"></script>
-    <script>
-        __splunkd_partials__ = ${json_decode(splunkd)};
-    </script>
-
-    <%
-    page_path = "/static/app/" + app_name + "/js/build/entry_page.js"
-    %>
+    <body style="min-width: 960px; background-color: #eee">
+        <script src="${make_url('/config?autoload=1')}" crossorigin="use-credentials"></script>
+        <script src="${make_url('/static/js/i18n.js')}"></script>
+        <script src="${make_url('/i18ncatalog?autoload=1')}"></script>
+        <script>
+            __splunkd_partials__ = ${json_decode(splunkd)};
+        </script>
 
-    <script src="${make_url(page_path)}"></script>
-</body>
+        <% page_path = "/static/app/" + app_name + "/js/build/entry_page.js" %>
 
+        <script src="${make_url(page_path)}"></script>
+    </body>
 </html>
diff --git a/splunk_add_on_ucc_framework/ucc_ui_lib/src/main/webapp/components/ControlWrapper.jsx b/splunk_add_on_ucc_framework/ucc_ui_lib/src/main/webapp/components/ControlWrapper.jsx
@@ -7,10 +7,6 @@ import CONTROL_TYPE_MAP from '../constants/ControlTypeMap';
 
 const CustomElement = styled.div`
     margin-left: 30px;
-
-    div {
-        width:100% !important
-    }
 `;
 
 const ControlGroupWrapper = styled(ControlGroup)`

diff --git a/splunk_add_on_ucc_framework/ucc_ui_lib/src/main/webapp/components/DeleteModal.jsx b/splunk_add_on_ucc_framework/ucc_ui_lib/src/main/webapp/components/DeleteModal.jsx
@@ -76,8 +76,7 @@ class DeleteModal extends Component {
             deleteMsg = _(`Are you sure you want to delete "`) + this.props.stanzaName + _(`" ? Ensure that no input is configured with "`) + this.props.stanzaName + _(`" as this will stop data collection for that input.`);
         }
         return (
-            <div>
-                <ModalWrapper onRequestClose={this.handleRequestClose} open={this.props.open}>
+            <ModalWrapper open={this.props.open}>
                     <Modal.Header
                         title={_("Delete Confirmation")}
                         onRequestClose={this.handleRequestClose}

diff --git a/splunk_add_on_ucc_framework/ucc_ui_lib/src/main/webapp/components/MultiInputComponent.jsx b/splunk_add_on_ucc_framework/ucc_ui_lib/src/main/webapp/components/MultiInputComponent.jsx
@@ -104,6 +104,7 @@ function MultiInputComponent(props) {
             allowNewValues={createSearchChoice}
             onChange={handleChange}
             inline
+            style={{ width: '100%' }}
         >
             {options && options.length > 0 && options}
         </Multiselect>

diff --git a/splunk_add_on_ucc_framework/ucc_ui_lib/src/main/webapp/components/RadioComponent.jsx b/splunk_add_on_ucc_framework/ucc_ui_lib/src/main/webapp/components/RadioComponent.jsx
@@ -15,6 +15,7 @@ class RadioComponent extends Component {
                 onChange={this.handleChange}
                 value={this.props.value}
                 key={this.props.field}
+                style={{ width: `50% !important` }}
             >
                 {this.props.controlOptions.items.map(item => (
                     <RadioBar.Option key={item.value} value={item.value} label={item.label} />

diff --git a/splunk_add_on_ucc_framework/ucc_ui_lib/src/main/webapp/components/SingleInputComponent.jsx b/splunk_add_on_ucc_framework/ucc_ui_lib/src/main/webapp/components/SingleInputComponent.jsx
@@ -113,6 +113,7 @@ function SingleInputComponent(props) {
             disabled={effectiveDisabled}
             onChange={handleChange}
             inline
+            style={{ width: '50%' }}
         >
             {options && options.length > 0 && options}
         </Select>

diff --git a/splunk_add_on_ucc_framework/ucc_ui_lib/src/main/webapp/components/TextComponent.jsx b/splunk_add_on_ucc_framework/ucc_ui_lib/src/main/webapp/components/TextComponent.jsx
@@ -3,8 +3,7 @@ import PropTypes from 'prop-types';
 import Text from '@splunk/react-ui/Text';
 
 class TextComponent extends Component {
-
-    handleChange = (e, {value}) => {
+    handleChange = (e, { value }) => {
         this.props.handleChange(this.props.field, value);
     };
 
@@ -19,6 +18,7 @@ class TextComponent extends Component {
                 value={this.props.value}
                 onChange={this.handleChange}
                 type={this.props.encrypted ? 'password' : 'text'}
+                style={{ width: '100%' }}
             />
         );
     }
@@ -30,8 +30,8 @@ TextComponent.propTypes = {
     field: PropTypes.string,
     error: PropTypes.bool,
     controlOptions: PropTypes.object,
-    encrypted:PropTypes.bool,
-    disabled:PropTypes.bool
+    encrypted: PropTypes.bool,
+    disabled: PropTypes.bool,
 };
 
 export default TextComponent;