🔨 refactor(codeTabsComponent): remove unused import of ShadTooltip component to improve code cleanliness and reduce bundle size

🔨 refactor(codeTabsComponent): remove unnecessary wrapping of TextAreaComponent and InputFileComponent components with ShadTooltip component to simplify code structure and improve performance
🔨 refactor(codeTabsComponent): remove unused onChange handlers in TextAreaComponent and InputFileComponent components to remove unnecessary code and improve code readability
🔨 refactor(codeTabsComponent): remove unnecessary className attribute in InputFileComponent component to remove redundant styling
🔨 refactor(codeTabsComponent): remove unused useEffect and useState imports to remove unnecessary code and improve code readability

🐛 fix(codeTabsComponent): fix JSX syntax error and improve code readability
✨ feat(codeTabsComponent): refactor codeTabsComponent to use separate components for different template types
This commit is contained in:
Cristhian Zanforlin Lousa 2023-09-26 23:44:15 -03:00
commit 76e0c6546a

View file

@ -3,7 +3,6 @@ import { useContext, useEffect, useState } from "react";
import { Prism as SyntaxHighlighter } from "react-syntax-highlighter"; import { Prism as SyntaxHighlighter } from "react-syntax-highlighter";
import { oneDark } from "react-syntax-highlighter/dist/cjs/styles/prism"; import { oneDark } from "react-syntax-highlighter/dist/cjs/styles/prism";
import AccordionComponent from "../../components/AccordionComponent"; import AccordionComponent from "../../components/AccordionComponent";
import ShadTooltip from "../../components/ShadTooltipComponent";
import CodeAreaComponent from "../../components/codeAreaComponent"; import CodeAreaComponent from "../../components/codeAreaComponent";
import Dropdown from "../../components/dropdownComponent"; import Dropdown from "../../components/dropdownComponent";
import FloatComponent from "../../components/floatComponent"; import FloatComponent from "../../components/floatComponent";
@ -322,13 +321,6 @@ export default function CodeTabsComponent({
) : node.data.node.template[ ) : node.data.node.template[
templateField templateField
].multiline ? ( ].multiline ? (
<ShadTooltip
content={tweaks.buildContent!(
node.data.node.template[
templateField
].value
)}
>
<div> <div>
<TextAreaComponent <TextAreaComponent
disabled={false} disabled={false}
@ -338,8 +330,7 @@ export default function CodeTabsComponent({
.template[ .template[
templateField templateField
].value || ].value ||
node.data.node node.data.node.template[
.template[
templateField templateField
].value === "" ].value === ""
? "" ? ""
@ -370,7 +361,6 @@ export default function CodeTabsComponent({
}} }}
/> />
</div> </div>
</ShadTooltip>
) : ( ) : (
<InputComponent <InputComponent
editNode={true} editNode={true}
@ -452,20 +442,6 @@ export default function CodeTabsComponent({
) : node.data.node.template[ ) : node.data.node.template[
templateField templateField
].type === "file" ? ( ].type === "file" ? (
<ShadTooltip
content={tweaks.buildContent!(
!node.data.node.template[
templateField
].value ||
node.data.node.template[
templateField
].value === ""
? ""
: node.data.node.template[
templateField
].value
)}
>
<div className="mx-auto"> <div className="mx-auto">
<InputFileComponent <InputFileComponent
editNode={true} editNode={true}
@ -475,9 +451,7 @@ export default function CodeTabsComponent({
templateField templateField
].value ?? "" ].value ?? ""
} }
onChange={( onChange={(target: any) => {}}
target: any
) => {}}
fileTypes={ fileTypes={
node.data.node.template[ node.data.node.template[
templateField templateField
@ -497,7 +471,6 @@ export default function CodeTabsComponent({
}} }}
></InputFileComponent> ></InputFileComponent>
</div> </div>
</ShadTooltip>
) : node.data.node.template[ ) : node.data.node.template[
templateField templateField
].type === "float" ? ( ].type === "float" ? (
@ -629,20 +602,6 @@ export default function CodeTabsComponent({
) : node.data.node.template[ ) : node.data.node.template[
templateField templateField
].type === "prompt" ? ( ].type === "prompt" ? (
<ShadTooltip
content={tweaks.buildContent!(
!node.data.node.template[
templateField
].value ||
node.data.node.template[
templateField
].value === ""
? ""
: node.data.node.template[
templateField
].value
)}
>
<div className="mx-auto"> <div className="mx-auto">
<PromptAreaComponent <PromptAreaComponent
editNode={true} editNode={true}
@ -655,8 +614,7 @@ export default function CodeTabsComponent({
templateField templateField
].value === "" ].value === ""
? "" ? ""
: node.data.node : node.data.node.template[
.template[
templateField templateField
].value ].value
} }
@ -681,23 +639,9 @@ export default function CodeTabsComponent({
}} }}
/> />
</div> </div>
</ShadTooltip>
) : node.data.node.template[ ) : node.data.node.template[
templateField templateField
].type === "code" ? ( ].type === "code" ? (
<ShadTooltip
content={tweaks.buildContent!(
tweaks.getValue!(
node.data.node.template[
templateField
].value,
node.data,
node.data.node.template[
templateField
]
)
)}
>
<div className="mx-auto"> <div className="mx-auto">
<CodeAreaComponent <CodeAreaComponent
disabled={false} disabled={false}
@ -710,8 +654,7 @@ export default function CodeTabsComponent({
templateField templateField
].value === "" ].value === ""
? "" ? ""
: node.data.node : node.data.node.template[
.template[
templateField templateField
].value ].value
} }
@ -736,23 +679,9 @@ export default function CodeTabsComponent({
}} }}
/> />
</div> </div>
</ShadTooltip>
) : node.data.node.template[ ) : node.data.node.template[
templateField templateField
].type === "dict" ? ( ].type === "dict" ? (
<ShadTooltip
content={tweaks.buildContent!(
tweaks.getValue!(
node.data.node.template[
templateField
].value,
node.data,
node.data.node.template[
templateField
]
)
)}
>
<div className="mx-auto max-h-48 overflow-auto custom-scroll"> <div className="mx-auto max-h-48 overflow-auto custom-scroll">
<KeypairListComponent <KeypairListComponent
disabled={false} disabled={false}
@ -808,23 +737,9 @@ export default function CodeTabsComponent({
}} }}
/> />
</div> </div>
</ShadTooltip>
) : node.data.node.template[ ) : node.data.node.template[
templateField templateField
].type === "NestedDict" ? ( ].type === "NestedDict" ? (
<ShadTooltip
content={tweaks.buildContent!(
tweaks.getValue!(
node.data.node.template[
templateField
].value,
node.data,
node.data.node.template[
templateField
]
)
)}
>
<div className="mx-auto"> <div className="mx-auto">
<DictComponent <DictComponent
disabled={false} disabled={false}
@ -832,8 +747,7 @@ export default function CodeTabsComponent({
value={ value={
node.data.node!.template[ node.data.node!.template[
templateField templateField
].value.toString() === ].value.toString() === "{}"
"{}"
? { ? {
yourkey: "value", yourkey: "value",
} }
@ -842,10 +756,27 @@ export default function CodeTabsComponent({
templateField templateField
].value ].value
} }
onChange={(target) => {}} onChange={(target) => {
setData((old) => {
let newInputList =
cloneDeep(old);
newInputList![
i
].data.node.template[
templateField
].value = target;
return newInputList;
});
tweaks.buildTweakObject!(
node["data"]["id"],
target,
node.data.node.template[
templateField
]
);
}}
/> />
</div> </div>
</ShadTooltip>
) : node.data.node.template[ ) : node.data.node.template[
templateField templateField
].type === "Any" ? ( ].type === "Any" ? (