fix: add collapsible rows in profiles

splunk · Jan 18, 2023 · 23035bb · 23035bb
1 parent f34525a
commit 23035bb
Show file tree

Hide file tree

Showing 4 changed files with 77 additions and 13 deletions.
diff --git a/backend/SC4SNMP_UI_backend/ui_handling/routes.py b/backend/SC4SNMP_UI_backend/ui_handling/routes.py
@@ -69,10 +69,15 @@ def get_all_profiles_list():
 @cross_origin()
 def add_profile_record():
     profile_obj = request.json
-    profile_obj = profile_conversion.ui2backend(profile_obj)
-    mongo_profiles.insert_one(profile_obj)
-    return jsonify("success")
-
+    same_name_profiles = list(mongo_profiles.find({f"{profile_obj['profileName']}": {"$exists": True}}))
+    if len(same_name_profiles) > 0:
+        result = jsonify(
+            {"message": f"Profile with name {profile_obj['profileName']} already exists. Profile was not added."}), 400
+    else:
+        profile_obj = profile_conversion.ui2backend(profile_obj)
+        mongo_profiles.insert_one(profile_obj)
+        result = jsonify("success")
+    return result
 
 @ui.route('/profiles/delete/<profile_id>', methods=['POST'])
 @cross_origin()
@@ -96,6 +101,12 @@ def delete_profile(index, record_to_update, kwargs):
 def update_profile_record(profile_id):
     profile_obj = request.json
     new_profile_name = profile_obj['profileName']
+
+    same_name_profiles = list(mongo_profiles.find({f"{new_profile_name}": {"$exists": True}}))
+    if len(same_name_profiles) > 0:
+        return jsonify(
+            {"message": f"Profile with name {new_profile_name} already exists. Profile was not edited."}), 400
+
     profile_obj = profile_conversion.ui2backend(profile_obj)
 
     old_profile = list(mongo_profiles.find({'_id': ObjectId(profile_id)}, {"_id": 0}))[0]

diff --git a/frontend/packages/manager/src/components/inventory/AddInventoryModal.jsx b/frontend/packages/manager/src/components/inventory/AddInventoryModal.jsx
@@ -78,8 +78,6 @@ function AddInventoryModal() {
             .catch((error) => {
                 ErrCtx.setOpen(true);
                 ErrCtx.setMessage(error.response.data.message);
-                console.log(error.response.data);
-                console.log(error.response.status);
             })
     };
 
@@ -91,8 +89,6 @@ function AddInventoryModal() {
             .catch((error) => {
                 ErrCtx.setOpen(true);
                 ErrCtx.setMessage(error.response.data.message);
-                console.log(error.response.data);
-                console.log(error.response.status);
             })
     };
 

diff --git a/frontend/packages/manager/src/components/profiles/AddProfileModal.jsx b/frontend/packages/manager/src/components/profiles/AddProfileModal.jsx
@@ -54,8 +54,13 @@ function AddProfileModal(props) {
             .then((response) => {
                 console.log(response);
                 ProfCtx.makeProfilesChange();
-        })
-    }
+            })
+            .catch((error) => {
+                console.log(error);
+                ErrCtx.setOpen(true);
+                ErrCtx.setMessage(error.response.data.message);
+            });
+    };
 
     const updateProfile = (profileObj, profileId) => {
         axios.post(`http://${backendHost}/profiles/update/${profileId}`, profileObj)
@@ -65,8 +70,12 @@ function AddProfileModal(props) {
                     ErrCtx.setOpen(true);
                     ErrCtx.setMessage(response.data.message);
                 }
-        })
-    }
+            })
+            .catch((error) => {
+                ErrCtx.setOpen(true);
+                ErrCtx.setMessage(error.response.data.message);
+            });
+    };
 
    const handleRequestClose = useCallback(
     (e) => {

diff --git a/frontend/packages/manager/src/components/profiles/ProfilesList.jsx b/frontend/packages/manager/src/components/profiles/ProfilesList.jsx
@@ -12,6 +12,40 @@ import ErrorsModalContext from "../../store/errors-modal-contxt";
 import {backendHost} from "../../host";
 import {Pagination} from "../../styles/groups/GroupsStyle";
 import DeleteModal from "../DeleteModal";
+import P from "@splunk/react-ui/Paragraph";
+
+
+function getExpansionRow(row) {
+    return (
+        <Table.Row key={`${row._id}-expansion`}>
+            <Table.Cell>{/* Empty cell */}</Table.Cell>
+            <Table.Cell>{/* Empty cell */}</Table.Cell>
+            <Table.Cell>{/* Empty cell */}</Table.Cell>
+            <Table.Cell>{row.conditions.field}</Table.Cell>
+            <Table.Cell>{row.conditions.patterns && row.conditions.patterns.map(value =>
+                                <P key={createDOMID()}>{value.pattern}</P>)}</Table.Cell>
+            <Table.Cell>
+                {row.varBinds.map((value) => (
+                    <P style={{height: "20px", overflow: "hidden", whiteSpace: "nowrap", textOverflow: "ellipsis"}} key={createDOMID()}>{value.family}</P>
+                ))}
+            </Table.Cell>
+
+            <Table.Cell>
+                {row.varBinds.map((value) => (
+                    <P style={{height: "20px", overflow: "hidden", whiteSpace: "nowrap", textOverflow: "ellipsis"}} key={createDOMID()}>{value.category}</P>
+                ))}
+            </Table.Cell>
+
+            <Table.Cell>
+                {row.varBinds.map((value) => (
+                    <P style={{height: "20px", overflow: "hidden", whiteSpace: "nowrap", textOverflow: "ellipsis"}} key={createDOMID()}>{value.index}</P>
+                ))}
+            </Table.Cell>
+
+            <Table.Cell />
+        </Table.Row>
+    );
+}
 
 function ProfilesList() {
 
@@ -31,6 +65,7 @@ function ProfilesList() {
     const [pageNum, setPageNum] = useState(1);
     const [totalPages, setTotalPages] = useState(1);
     const [profilesRecords, setProfilesRecords] = useState([]);
+    const [expandedRowId, setExpandedRowId] = useState(null);
     const ProfCtx = useContext(ProfileContext);
     const ErrCtx = useContext(ErrorsModalContext);
 
@@ -102,6 +137,14 @@ function ProfilesList() {
         ProfCtx.addModalToggle?.current?.focus();
     };
 
+    const handleRowExpansion = (rowId) => {
+        if (expandedRowId === rowId) {
+            setExpandedRowId(null);
+        } else {
+            setExpandedRowId(rowId);
+        }
+    };
+
     return (
         <div style={{width: '100%' }}>
             <Pagination>
@@ -132,7 +175,12 @@ function ProfilesList() {
                 <Table.Body>
                     {profilesRecords
                         .map((row) => (
-                            <Table.Row key={createDOMID()}>
+                            <Table.Row
+                                key={row._id}
+                                expansionRow={getExpansionRow(row)}
+                                onExpansion={() => handleRowExpansion(row._id)}
+                                expanded={row._id === expandedRowId}
+                            >
                                 <Table.Cell>{row.profileName}</Table.Cell>
                                 <Table.Cell>{row.frequency}</Table.Cell>
                                 <Table.Cell>{row.conditions.condition}</Table.Cell>