jyapayne/langflow
1
0
Fork 0
Code Issues Pull requests Projects Releases 1 Packages Wiki Activity Actions

🐛 fix(parameterComponent): fix key prop warning by generating random key using new function getRandomKeyByssmm

Browse source 
✨ feat(parameterComponent): add support for dynamic rendering of parameter component by grouping data by family
🐛 fix(menuBar): fix DropdownMenuTrigger component by adding asChild prop
🐛 fix(card.tsx): change p tag to div tag to fix accessibility issue
🐛 fix(extraSidebarComponent): fix key prop warning by adding key prop to Tooltip component
✨ feat(utils.ts): add new function getRandomKeyByssmm to generate random keys for components
This commit is contained in:
Cristhian Zanforlin Lousa 2023-06-22 19:22:04 -03:00
commit 49a2935ab3
6 changed files with 41 additions and 35 deletions
Download patch file Download diff file Expand all files Collapse all files

46
src/frontend/package-lock.json generated
View file

@ -427,14 +427,6 @@
"node": ">=6.9.0"
}
},
"node_modules/@babel/types/node_modules/@babel/helper-validator-identifier": {
"version": "7.22.5",
"resolved": "https://registry.npmjs.org/@babel/helper-validator-identifier/-/helper-validator-identifier-7.22.5.tgz",
"integrity": "sha512-aJXu+6lErq8ltp+JhkJUfk1MTGyuA4v7f3pA+BJ5HLfNC6nAQ0Cpi9uOquUj8Hehg0aUiHzWQbOVJGao6ztBAQ==",
"engines": {
"node": ">=6.9.0"
}
},
"node_modules/@emotion/babel-plugin": {
"version": "11.11.0",
"resolved": "https://registry.npmjs.org/@emotion/babel-plugin/-/babel-plugin-11.11.0.tgz",
@ -931,9 +923,9 @@
"integrity": "sha512-Bu+AMaXNjrpjh41znzHqaz3r2Nr8hHuHZT6V2LBKMhyMl0FgKA62PNYbqnfgmzOhoWZj70Zecisbo4H1rotP5g=="
},
"node_modules/@floating-ui/dom": {
"version": "1.4.1",
"resolved": "https://registry.npmjs.org/@floating-ui/dom/-/dom-1.4.1.tgz",
"integrity": "sha512-loCXUOLzIC3jp50RFOKXZ/kQjjz26ryr/23M+FWG9jrmAv8lRf3DUfC2AiVZ3+K316GOhB08CR+Povwz8e9mDw==",
"version": "1.4.2",
"resolved": "https://registry.npmjs.org/@floating-ui/dom/-/dom-1.4.2.tgz",
"integrity": "sha512-VKmvHVatWnewmGGy+7Mdy4cTJX71Pli6v/Wjb5RQBuq5wjUYx+Ef+kRThi8qggZqDgD8CogCpqhRoVp3+yQk+g==",
"dependencies": {
"@floating-ui/core": "^1.3.1"
}
@ -1003,19 +995,24 @@
}
},
"node_modules/@jridgewell/sourcemap-codec": {
"version": "1.4.14",
"resolved": "https://registry.npmjs.org/@jridgewell/sourcemap-codec/-/sourcemap-codec-1.4.14.tgz",
"integrity": "sha512-XPSJHWmi394fuUuzDnGz1wiKqWfo1yXecHQMRf2l6hztTO+nPru658AyDngaBe7isIxEkRsPR3FZh+s7iVa4Uw=="
"version": "1.4.15",
"resolved": "https://registry.npmjs.org/@jridgewell/sourcemap-codec/-/sourcemap-codec-1.4.15.tgz",
"integrity": "sha512-eF2rxCRulEKXHTRiDrDy6erMYWqNw4LPdQ8UQA4huuxaQsVeRPFl2oM8oDGxMFhJUWZf9McpLtJasDDZb/Bpeg=="
},
"node_modules/@jridgewell/trace-mapping": {
"version": "0.3.17",
"resolved": "https://registry.npmjs.org/@jridgewell/trace-mapping/-/trace-mapping-0.3.17.tgz",
"integrity": "sha512-MCNzAp77qzKca9+W/+I0+sEpaUnZoeasnghNeVc41VZCEKaCH73Vq3BZZ/SzWIgrqE4H4ceI+p+b6C0mHf9T4g==",
"version": "0.3.18",
"resolved": "https://registry.npmjs.org/@jridgewell/trace-mapping/-/trace-mapping-0.3.18.tgz",
"integrity": "sha512-w+niJYzMHdd7USdiH2U6869nqhD2nbfZXND5Yp93qIbEmnDNk7PD48o+YchRVpzMU7M6jVCbenTR7PA1FLQ9pA==",
"dependencies": {
"@jridgewell/resolve-uri": "3.1.0",
"@jridgewell/sourcemap-codec": "1.4.14"
}
},
"node_modules/@jridgewell/trace-mapping/node_modules/@jridgewell/sourcemap-codec": {
"version": "1.4.14",
"resolved": "https://registry.npmjs.org/@jridgewell/sourcemap-codec/-/sourcemap-codec-1.4.14.tgz",
"integrity": "sha512-XPSJHWmi394fuUuzDnGz1wiKqWfo1yXecHQMRf2l6hztTO+nPru658AyDngaBe7isIxEkRsPR3FZh+s7iVa4Uw=="
},
"node_modules/@mole-inc/bin-wrapper": {
"version": "8.0.1",
"resolved": "https://registry.npmjs.org/@mole-inc/bin-wrapper/-/bin-wrapper-8.0.1.tgz",
@ -3447,7 +3444,7 @@
"version": "16.18.12",
"resolved": "https://registry.npmjs.org/@types/node/-/node-16.18.12.tgz",
"integrity": "sha512-vzLe5NaNMjIE3mcddFVGlAXN1LEWueUsMsOJWaT6wWMJGyljHAWHznqfnKUQWGzu7TLPrGvWdNAsvQYW+C0xtw==",
"devOptional": true
"dev": true
},
"node_modules/@types/parse-json": {
"version": "4.0.0",
@ -5013,9 +5010,9 @@
}
},
"node_modules/electron-to-chromium": {
"version": "1.4.434",
"resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.4.434.tgz",
"integrity": "sha512-5Gvm09UZTQRaWrimRtWRO5rvaX6Kpk5WHAPKDa7A4Gj6NIPuJ8w8WNpnxCXdd+CJJt6RBU6tUw0KyULoW6XuHw=="
"version": "1.4.438",
"resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.4.438.tgz",
"integrity": "sha512-x94U0FhphEsHsOloCvlsujHCvoir0ZQ73ZAs/QN4PLx98uNvyEU79F75rq1db75Bx/atvuh7KPeuxelh+xfYJw=="
},
"node_modules/emoji-regex": {
"version": "8.0.0",
@ -5507,6 +5504,7 @@
"version": "2.3.2",
"resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.2.tgz",
"integrity": "sha512-xiqMQR4xAeHTuB9uWm+fFRcIOgKBMiOBP+eXiyT7jsgVCq1bkVygt00oASowB7EdtpOHaaPgKt812P9ab+DDKA==",
"dev": true,
"hasInstallScript": true,
"optional": true,
"os": [
@ -8280,9 +8278,9 @@
}
},
"node_modules/pirates": {
"version": "4.0.5",
"resolved": "https://registry.npmjs.org/pirates/-/pirates-4.0.5.tgz",
"integrity": "sha512-8V9+HQPupnaXMA23c5hvl69zXvTwTzyAYasnkb0Tts4XvO4CliqONMOnvlq26rkhLC3nWDFBJf73LU1e1VZLaQ==",
"version": "4.0.6",
"resolved": "https://registry.npmjs.org/pirates/-/pirates-4.0.6.tgz",
"integrity": "sha512-saLsH7WeYYPiD25LDuLRRY/i+6HaPYr6G1OUlN39otzkSTxKnubR9RTxS3/Kk50s1g2JTgFwWQDQyplC5/SHZg==",
"engines": {
"node": ">= 6"
}

18
src/frontend/src/CustomNodes/GenericNode/components/parameterComponent/index.tsx
View file

@ -1,6 +1,7 @@
import { Handle, Position, useUpdateNodeInternals } from "reactflow";
import {
classNames,
getRandomKeyByssmm,
groupByFamily,
isValidConnection,
} from "../../../../utils";
@ -79,10 +80,10 @@ export default function ParameterComponent({
useEffect(() => {
const groupedObj = groupByFamily(myData, tooltipTitle);
refHtml.current = groupedObj.map((item, i) => (
<span
key={i}
key={getRandomKeyByssmm()}
className={classNames(
i > 0 ? "items-center flex mt-3" : "items-center flex"
)}
@ -102,20 +103,19 @@ export default function ParameterComponent({
-&nbsp;
{item.type.split(", ").length > 2
? item.type.split(", ").map((el, i) => (
<>
<span key={i}>
{i == item.type.split(", ").length - 1
? el
: (el += `, `)}
<React.Fragment key={el + i}>
<span>
{i === item.type.split(", ").length - 1 ? el : (el += `, `)}
</span>
{i % 2 == 0 && i > 0 && <br></br>}
</>
{i % 2 === 0 && i > 0 && <br />}
</React.Fragment>
))
: item.type}
</span>
</span>
</span>
));
}, [tooltipTitle]);
return (

2
src/frontend/src/components/headerComponent/components/menuBar/index.tsx
View file

@ -53,7 +53,7 @@ export const MenuBar = ({ flows, tabId }) => {
</Link>
<div className="flex items-center font-medium text-sm rounded-md py-1 px-1.5 gap-0.5">
<DropdownMenu>
<DropdownMenuTrigger>
<DropdownMenuTrigger asChild>
<Button
className="gap-2 flex items-center max-w-[200px]"
variant="primary"

2
src/frontend/src/components/ui/card.tsx
View file

@ -47,7 +47,7 @@ const CardDescription = React.forwardRef<
HTMLParagraphElement,
React.HTMLAttributes<HTMLParagraphElement>
>(({ className, ...props }, ref) => (
<p
<div
ref={ref}
className={cn("text-sm text-muted-foreground", className)}
{...props}

1
src/frontend/src/pages/FlowPage/components/extraSidebarComponent/index.tsx
View file

@ -160,6 +160,7 @@ export default function ExtraSidebar() {
content={t}
delayDuration={1500}
side="right"
key={i}
>
<div key={k} data-tooltip-id={t}>
<div

7
src/frontend/src/utils.ts
View file

@ -812,3 +812,10 @@ export function getRandomName(
// Return title case final name
return toTitleCase(final_name);
}
export function getRandomKeyByssmm(): string{
const now = new Date();
const seconds = String(now.getSeconds()).padStart(2, '0');
const milliseconds = String(now.getMilliseconds()).padStart(3, '0');
return seconds + milliseconds;
}