github/kubeshark
1
0
Fork 0
mirror of https://github.com/kubeshark/kubeshark.git synced 2025-09-26 13:04:13 +00:00
Code Issues Packages Projects Releases Wiki Activity

select list changes

Browse Source
This commit is contained in:
Amit Fainholts
2022-01-27 15:00:24 +02:00
parent 462bf72632
commit 889fa7881c
2 changed files with 22 additions and 34 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
ui/src/components/Modals/AddWorkspaceModal/AddWorkspaceModal.tsx
View File

@@ -35,16 +35,12 @@ const AddWorkspaceModal: FC<AddWorkspaceModalProp> = ({isOpen,onCloseModal, work
try { try {
setSearchValue(""); setSearchValue("");
const tapConfig = await api.getTapConfig(); const tapConfig = await api.getTapConfig();
console.log(tapConfig);
// if(isFirstLogin) {
const namespacesObj = {...tapConfig?.tappedNamespaces} const namespacesObj = {...tapConfig?.tappedNamespaces}
Object.keys(tapConfig?.tappedNamespaces ?? {}).forEach(namespace => { Object.keys(tapConfig?.tappedNamespaces ?? {}).forEach(namespace => {
namespacesObj[namespace] = true; namespacesObj[namespace] = true;
}) })
setNamespaces(namespacesObj); setNamespaces(namespacesObj);
// } else {
setNamespaces(tapConfig?.tappedNamespaces); setNamespaces(tapConfig?.tappedNamespaces);
// }
} catch (e) { } catch (e) {
console.error(e); console.error(e);
} finally { } finally {

38
ui/src/components/UI/SelectList.tsx
View File

@@ -27,37 +27,29 @@ const SelectList: React.FC<Props> = ({valuesListInput ,tableName,multiSelect=tru
} }
else { else {
const newValues: ValuesListInput = [...valuesList]; const newValues: ValuesListInput = [...valuesList];
newValues[checkedKey].isChecked = !valuesList[checkedKey].isChecked; newValues.map(item => item.key === checkedKey ? item.isChecked = !item.isChecked : item.isChecked);
setValuesList(newValues); setValuesList(newValues);
setValues(newValues); setValues(newValues);
} }
} }
const unToggleAll = (checkedKey) => { const unToggleAll = (checkedKey) => {
const newValues = []; const list = valuesList.map((obj) => {
valuesList.forEach(valueList => { return {...obj, isChecked:checkedKey === obj.key}
if (valueList.key !== checkedKey)
newValues[checkedKey] = false;
else
newValues[checkedKey] = true;
}) })
setValuesList(newValues); setValuesList(list);
setValues(newValues); setValues(list);
} }
const toggleAll = () => { const toggleAll = () => {
const isChecked = valuesList.every(valueTap => valueTap.isChecked === true); const list = valuesList.map((obj) => {
setAllCheckedValue(!isChecked); return {...obj, isChecked: true}
})
setValuesList(list);
setValues(list);
} }
const setAllCheckedValue = (isTap: boolean) => {
const newValues = [];
valuesList.forEach(valueList => {
newValues[valueList.key] = isTap;
})
setValuesList(newValues);
setValues(newValues);
}
const tableHead = multiSelect ? <tr style={{borderBottomWidth: "2px"}}> const tableHead = multiSelect ? <tr style={{borderBottomWidth: "2px"}}>
<th style={{width: 50}}><Checkbox checked={valuesList.every(valueTap => valueTap.isChecked === false)} <th style={{width: 50}}><Checkbox checked={valuesList.every(valueTap => valueTap.isChecked === false)}
@@ -69,7 +61,7 @@ const SelectList: React.FC<Props> = ({valuesListInput ,tableName,multiSelect=tru
</tr> </tr>
const filteredValues = useMemo(() => { const filteredValues = useMemo(() => {
return valuesList.filter((listValue) => listValue.value.includes(searchValue)); return valuesList.filter((listValue) => listValue?.value?.includes(searchValue));
},[valuesList, searchValue]) },[valuesList, searchValue])
return <div className={tabelClassName + " select-list-table"}> return <div className={tabelClassName + " select-list-table"}>
@@ -81,10 +73,10 @@ const SelectList: React.FC<Props> = ({valuesListInput ,tableName,multiSelect=tru
{filteredValues?.map(listValue => { {filteredValues?.map(listValue => {
return <tr key={listValue.key}> return <tr key={listValue.key}>
<td style={{width: 50}}> <td style={{width: 50}}>
{multiSelect && <Checkbox checked={valuesList[listValue.key].isChecked} onToggle={() => toggleValues(listValue.key)}/>} {multiSelect && <Checkbox checked={valuesList.find(item => item.key === listValue.key)?.isChecked} onToggle={() => toggleValues(listValue.key)}/>}
{!multiSelect && <Radio checked={valuesList[listValue.key].isChecked} onToggle={() => toggleValues(listValue.key)}/>} {!multiSelect && <Radio checked={valuesList.find(item => item.key === listValue.key)?.isChecked} onToggle={() => toggleValues(listValue.key)}/>}
</td> </td>
<td>{listValue}</td> <td>{listValue.value}</td>
</tr> </tr>
} }
)} )}