fix: fixes react key error in browser on flow page for extra sidebar disclosure components (#2295)

Fixes key error in browser on flow page for extra sidebar disclosure components

Co-authored-by: Lucas Oliveira <62335616+lucaseduoli@users.noreply.github.com>
Co-authored-by: anovazzi1 <otavio2204@gmail.com>
This commit is contained in:
596050 2024-07-04 01:42:41 +01:00 • committed by GitHub
commit be21f2f95a
No known key found for this signature in database
GPG key ID: B5690EEEBB952194

View file

@ -1,6 +1,6 @@
import { cloneDeep } from "lodash"; import { cloneDeep } from "lodash";
import { LinkIcon, SparklesIcon } from "lucide-react"; import { LinkIcon, SparklesIcon } from "lucide-react";
import { useEffect, useMemo, useState } from "react"; import { Fragment, useEffect, useMemo, useState } from "react";
import IconComponent from "../../../../components/genericIconComponent"; import IconComponent from "../../../../components/genericIconComponent";
import ShadTooltip from "../../../../components/shadTooltipComponent"; import ShadTooltip from "../../../../components/shadTooltipComponent";
import { Input } from "../../../../components/ui/input"; import { Input } from "../../../../components/ui/input";
@ -296,7 +296,6 @@ export default function ExtraSidebar(): JSX.Element {
.filter((x) => PRIORITY_SIDEBAR_ORDER.includes(x)) .filter((x) => PRIORITY_SIDEBAR_ORDER.includes(x))
.map((SBSectionName: keyof APIObjectType, index) => .map((SBSectionName: keyof APIObjectType, index) =>
Object.keys(dataFilter[SBSectionName]).length > 0 ? ( Object.keys(dataFilter[SBSectionName]).length > 0 ? (
<>
<DisclosureComponent <DisclosureComponent
defaultOpen={ defaultOpen={
getFilterEdge.length !== 0 || search.length !== 0 getFilterEdge.length !== 0 || search.length !== 0
@ -341,9 +340,7 @@ export default function ExtraSidebar(): JSX.Element {
color={nodeColors[SBSectionName]} color={nodeColors[SBSectionName]}
itemName={SBItemName} itemName={SBItemName}
//convert error to boolean //convert error to boolean
error={ error={!!dataFilter[SBSectionName][SBItemName].error}
!!dataFilter[SBSectionName][SBItemName].error
}
display_name={ display_name={
dataFilter[SBSectionName][SBItemName].display_name dataFilter[SBSectionName][SBItemName].display_name
} }
@ -358,7 +355,6 @@ export default function ExtraSidebar(): JSX.Element {
))} ))}
</div> </div>
</DisclosureComponent> </DisclosureComponent>
</>
) : ( ) : (
<div key={index}></div> <div key={index}></div>
), ),
@ -377,7 +373,9 @@ export default function ExtraSidebar(): JSX.Element {
.filter((x) => !PRIORITY_SIDEBAR_ORDER.includes(x)) .filter((x) => !PRIORITY_SIDEBAR_ORDER.includes(x))
.map((SBSectionName: keyof APIObjectType, index) => .map((SBSectionName: keyof APIObjectType, index) =>
Object.keys(dataFilter[SBSectionName]).length > 0 ? ( Object.keys(dataFilter[SBSectionName]).length > 0 ? (
<> <Fragment
key={`DisclosureComponent${index + search + JSON.stringify(getFilterEdge)}`}
>
<DisclosureComponent <DisclosureComponent
isChild={false} isChild={false}
defaultOpen={ defaultOpen={
@ -385,7 +383,6 @@ export default function ExtraSidebar(): JSX.Element {
? true ? true
: false : false
} }
key={index + search + JSON.stringify(getFilterEdge)}
button={{ button={{
title: nodeNames[SBSectionName] ?? nodeNames.unknown, title: nodeNames[SBSectionName] ?? nodeNames.unknown,
Icon: Icon:
@ -470,7 +467,7 @@ export default function ExtraSidebar(): JSX.Element {
</a> </a>
</> </>
)} )}
</> </Fragment>
) : ( ) : (
<div key={index}></div> <div key={index}></div>
), ),