From 20050bcba161974400813d4f7804a755c85f99b0 Mon Sep 17 00:00:00 2001 From: Vladyslav Matsiiako Date: Sun, 25 Dec 2022 21:37:53 -0500 Subject: [PATCH] solved the bug with duplicate management --- frontend/components/basic/Toggle.tsx | 29 ++++++++++++++++++++++- frontend/components/dashboard/SideBar.tsx | 25 +++++++++++++++---- frontend/pages/dashboard/[id].tsx | 27 +++++++++++++-------- 3 files changed, 66 insertions(+), 15 deletions(-) diff --git a/frontend/components/basic/Toggle.tsx b/frontend/components/basic/Toggle.tsx index 7702bb29ef..fa69e44198 100644 --- a/frontend/components/basic/Toggle.tsx +++ b/frontend/components/basic/Toggle.tsx @@ -18,6 +18,8 @@ interface ToggleProps { pos: number; id: string; deleteOverride: (id: string) => void; + sharedToHide: string[]; + setSharedToHide: (values: string[]) => void; } /** @@ -25,16 +27,41 @@ interface ToggleProps { * @param obj * @param {boolean} obj.enabled - whether the toggle is turned on or off * @param {function} obj.setEnabled - change the state of the toggle + * @param {function} obj.addOverride - a function that adds an override to a certain secret + * @param {string} obj.keyName - key of a certain secret + * @param {string} obj.value - value of a certain secret + * @param {number} obj.pos - position of a certain secret + #TODO: make the secret id persistent? + * @param {string} obj.id - id of a certain secret + * @param {function} obj.deleteOverride - a function that deleted an override for a certain secret + * @param {string[]} obj.sharedToHide - an array of shared secrets that we want to hide visually because they are overriden. + * @param {function} obj.setSharedToHide - a function that updates the array of secrets that we want to hide visually * @returns */ -export default function Toggle ({ enabled, setEnabled, addOverride, keyName, value, pos, id, deleteOverride }: ToggleProps): JSX.Element { +export default function Toggle ({ + enabled, + setEnabled, + addOverride, + keyName, + value, + pos, + id, + deleteOverride, + sharedToHide, + setSharedToHide +}: ToggleProps): JSX.Element { return ( { if (enabled == false) { addOverride({ id, keyName, value, pos }); + setSharedToHide([ + ...sharedToHide!, + id + ]) } else { + setSharedToHide(sharedToHide!.filter(tempId => tempId != id)) deleteOverride(id); } setEnabled(!enabled); diff --git a/frontend/components/dashboard/SideBar.tsx b/frontend/components/dashboard/SideBar.tsx index 5051820cc6..f8d6e9eba0 100644 --- a/frontend/components/dashboard/SideBar.tsx +++ b/frontend/components/dashboard/SideBar.tsx @@ -33,6 +33,8 @@ interface SideBarProps { deleteOverride: (id: string) => void; buttonReady: boolean; savePush: () => void; + sharedToHide: string[]; + setSharedToHide: (values: string[]) => void; } /** @@ -45,9 +47,22 @@ interface SideBarProps { * @param {function} obj.deleteOverride - delete the personal override for a certain secret * @param {boolean} obj.buttonReady - is the button for saving chagnes active * @param {function} obj.savePush - save changes andp ush secrets + * @param {string[]} obj.sharedToHide - an array of shared secrets that we want to hide visually because they are overriden. + * @param {function} obj.setSharedToHide - a function that updates the array of secrets that we want to hide visually * @returns the sidebar with 'secret's settings' */ -const SideBar = ({ toggleSidebar, data, modifyKey, modifyValue, addOverride, deleteOverride, buttonReady, savePush }: SideBarProps) => { +const SideBar = ({ + toggleSidebar, + data, + modifyKey, + modifyValue, + addOverride, + deleteOverride, + buttonReady, + savePush, + sharedToHide, + setSharedToHide +}: SideBarProps) => { const [overrideEnabled, setOverrideEnabled] = useState(data.map(secret => secret.type).includes("personal")); console.log("sidebar", data, data.map(secret => secret.type).includes("personal")) @@ -66,7 +81,7 @@ const SideBar = ({ toggleSidebar, data, modifyKey, modifyValue, addOverride, del type="varName" position={data[0].pos} value={data[0].key} - duplicates={[]} + isDuplicate={false} blurred={false} /> @@ -78,7 +93,7 @@ const SideBar = ({ toggleSidebar, data, modifyKey, modifyValue, addOverride, del type="value" position={data.filter(secret => secret.type == "shared")[0]?.pos} value={data.filter(secret => secret.type == "shared")[0]?.value} - duplicates={[]} + isDuplicate={false} blurred={true} />
@@ -102,6 +117,8 @@ const SideBar = ({ toggleSidebar, data, modifyKey, modifyValue, addOverride, del pos={data[0].pos} id={data[0].id} deleteOverride={deleteOverride} + sharedToHide={sharedToHide} + setSharedToHide={setSharedToHide} />
}
@@ -110,7 +127,7 @@ const SideBar = ({ toggleSidebar, data, modifyKey, modifyValue, addOverride, del type="value" position={overrideEnabled ? data.filter(secret => secret.type == "personal")[0].pos : data[0].pos} value={overrideEnabled ? data.filter(secret => secret.type == "personal")[0].value : data[0].value} - duplicates={[]} + isDuplicate={false} blurred={true} />
diff --git a/frontend/pages/dashboard/[id].tsx b/frontend/pages/dashboard/[id].tsx index 276d7c5ade..3852e44f6d 100644 --- a/frontend/pages/dashboard/[id].tsx +++ b/frontend/pages/dashboard/[id].tsx @@ -88,6 +88,7 @@ export default function Dashboard() { const [checkDocsPopUpVisible, setCheckDocsPopUpVisible] = useState(false); const [hasUserEverPushed, setHasUserEverPushed] = useState(false); const [sidebarSecretId, toggleSidebar] = useState("None"); + const [sharedToHide, setSharedToHide] = useState([]); const { createNotification } = useNotificationContext(); @@ -160,6 +161,16 @@ export default function Dashboard() { }); reorderRows(dataToSort); + setSharedToHide( + dataToSort?.filter(row => (dataToSort + ?.map((item) => item.key) + .filter( + (item, index) => + index !== + dataToSort?.map((item) => item.key).indexOf(item) + ).includes(row.key) && row.type == 'shared'))?.map((item) => item.id) + ) + const user = await getUser(); setIsNew( (Date.parse(String(new Date())) - Date.parse(user.createdAt)) / 60000 < 3 @@ -289,7 +300,7 @@ export default function Dashboard() { const nameErrors = !Object.keys(obj) .map((key) => !isNaN(Number(key[0].charAt(0)))) .every((v) => v === false); - const duplicatesExist = findDuplicates(data!.map((item: SecretDataProps) => [item.key, item.type])).length > 0; + const duplicatesExist = findDuplicates(data!.map((item: SecretDataProps) => item.key + item.type)).length > 0; if (nameErrors) { return createNotification({ @@ -402,6 +413,8 @@ export default function Dashboard() { deleteOverride={deleteOverride} buttonReady={buttonReady} savePush={savePush} + sharedToHide={sharedToHide} + setSharedToHide={setSharedToHide} />}
@@ -548,21 +561,15 @@ export default function Dashboard() { className={`bg-white/5 mt-1 mb-1 rounded-md pb-2 max-w-5xl overflow-visible`} >
- {data?.filter(row => !(data - ?.map((item) => item.key) - .filter( - (item, index) => - index !== - data?.map((item) => item.key).indexOf(item) - ).includes(row.key) && row.type == 'shared')).map((keyPair) => ( - !(sharedToHide.includes(row.id) && row.type == 'shared')).map((keyPair) => ( + [item.key, item.type]))?.includes(keyPair.value)} + isDuplicate={findDuplicates(data?.map((item) => item.key + item.type))?.includes(keyPair.key + keyPair.type)} toggleSidebar={toggleSidebar} sidebarSecretId={sidebarSecretId} />