Fix: bug on disabled share when there is no api key

This commit is contained in:
igorrCarvalho 2023-11-27 21:28:33 -03:00
commit fa627eea03
5 changed files with 89 additions and 44 deletions

View file

@ -198,14 +198,19 @@ export default function GenericNode({
</div>
) : (
<ShadTooltip content={data.node?.display_name}>
<div className="flex" onDoubleClick={() => setInputName(true)}>
<div
className="generic-node-tooltip-div text-primary pr-3"
>
<div
className="flex"
onDoubleClick={() => setInputName(true)}
>
<div className="generic-node-tooltip-div pr-3 text-primary">
{data.node?.display_name}
</div>
{data.node?.flow&& <IconComponent name="Pencil" className="w-5 h-5 text-primary-content" />}
{data.node?.flow && (
<IconComponent
name="Pencil"
className="h-5 w-5 text-primary-content"
/>
)}
</div>
</ShadTooltip>
)}
@ -235,10 +240,10 @@ export default function GenericNode({
setData={setData}
color={
nodeColors[
types[data.node?.template[templateField].type!]
types[data.node?.template[templateField].type!]
] ??
nodeColors[
data.node?.template[templateField].type!
data.node?.template[templateField].type!
] ??
nodeColors.unknown
}
@ -285,7 +290,7 @@ export default function GenericNode({
color={nodeColors[types[data.type]] ?? nodeColors.unknown}
title={
data.node?.output_types &&
data.node.output_types.length > 0
data.node.output_types.length > 0
? data.node.output_types.join("|")
: data.type
}
@ -323,10 +328,10 @@ export default function GenericNode({
<div className="max-h-96 overflow-auto">
{typeof validationStatus.params === "string"
? validationStatus.params
.split("\n")
.map((line: string, index: number) => (
<div key={index}>{line}</div>
))
.split("\n")
.map((line: string, index: number) => (
<div key={index}>{line}</div>
))
: ""}
</div>
)
@ -370,14 +375,14 @@ export default function GenericNode({
className={
showNode
? "generic-node-desc " +
(data.node?.description !== "" ? "py-5" : "pb-5")
(data.node?.description !== "" ? "py-5" : "pb-5")
: ""
}
>
{data.node?.description !== "" &&
showNode &&
data.node?.flow &&
inputDescription ? (
showNode &&
data.node?.flow &&
inputDescription ? (
<Textarea
autoFocus
onBlur={() => {
@ -432,7 +437,7 @@ export default function GenericNode({
.map((templateField: string, idx) => (
<div key={idx}>
{data.node!.template[templateField].show &&
!data.node!.template[templateField].advanced ? (
!data.node!.template[templateField].advanced ? (
<ParameterComponent
index={idx.toString()}
key={scapedJSONStringfy({
@ -447,10 +452,10 @@ export default function GenericNode({
setData={setData}
color={
nodeColors[
types[data.node?.template[templateField].type!]
types[data.node?.template[templateField].type!]
] ??
nodeColors[
data.node?.template[templateField].type!
data.node?.template[templateField].type!
] ??
nodeColors.unknown
}

View file

@ -30,7 +30,7 @@ export default function ExtraSidebar(): JSX.Element {
useContext(typesContext);
const { flows, tabId, uploadFlow, tabsState, saveFlow, isBuilt, version } =
useContext(FlowsContext);
const { hasApiKey,validApiKey } = useContext(StoreContext);
const { hasApiKey, validApiKey } = useContext(StoreContext);
const { setErrorData } = useContext(alertContext);
const [dataFilter, setFilterData] = useState(data);
const [search, setSearch] = useState("");
@ -181,25 +181,54 @@ export default function ExtraSidebar(): JSX.Element {
}, [getFilterEdge, data]);
const ModalMemo = useMemo(
() => (
<ShareModal is_component={false} component={flow!} disabled={(!hasApiKey||!validApiKey)}>
<ShadTooltip content="Share" side="top">
<button disabled={!hasApiKey} className={classNames("extra-side-bar-buttons",(!hasApiKey||!validApiKey)?"button-disable cursor-default":"")}>
<IconComponent name="Share2" className={classNames("side-bar-button-size",(!hasApiKey||!validApiKey)?"extra-side-bar-save-disable":"")} />
() =>
!hasApiKey || !validApiKey ? (
<button
disabled={!hasApiKey || !validApiKey}
className={classNames(
"extra-side-bar-buttons",
!hasApiKey || !validApiKey ? "button-disable cursor-default" : ""
)}
>
<IconComponent
name="Share2"
className={classNames(
"side-bar-button-size",
!hasApiKey || !validApiKey ? "extra-side-bar-save-disable" : ""
)}
/>
</button>
) : (
<ShareModal
is_component={false}
component={flow!}
disabled={!hasApiKey || !validApiKey}
>
<button
disabled={!hasApiKey || !validApiKey}
className={classNames(
"extra-side-bar-buttons",
!hasApiKey || !validApiKey ? "button-disable cursor-default" : ""
)}
>
<IconComponent
name="Share2"
className={classNames(
"side-bar-button-size",
!hasApiKey || !validApiKey ? "extra-side-bar-save-disable" : ""
)}
/>
</button>
</ShadTooltip>
</ShareModal>
),
[hasApiKey,validApiKey]
</ShareModal>
),
[hasApiKey, validApiKey]
);
const ExportMemo = useMemo(
() => (
<ExportModal>
<ShadTooltip content="Export" side="top">
<button
className={classNames("extra-side-bar-buttons")}
>
<button className={classNames("extra-side-bar-buttons")}>
<IconComponent name="FileDown" className="side-bar-button-size" />
</button>
</ShadTooltip>
@ -280,8 +309,9 @@ export default function ExtraSidebar(): JSX.Element {
</div>
</ShadTooltip>
</div>
<div className="side-bar-button">{ModalMemo}</div>
<ShadTooltip content="Share" side="top" styleClasses="cursor-default">
<div className="side-bar-button">{ModalMemo}</div>
</ShadTooltip>
</div>
<Separator />
<div className="side-bar-search-div-placement">

View file

@ -52,7 +52,7 @@ export default function NodeToolbarComponent({
);
const updateNodeInternals = useUpdateNodeInternals();
const { getNodeId } = useContext(FlowsContext);
const { hasApiKey,validApiKey } = useContext(StoreContext);
const { hasApiKey, validApiKey } = useContext(StoreContext);
function canMinimize() {
let countHandles: number = 0;
@ -161,9 +161,9 @@ export default function NodeToolbarComponent({
<a
className={classNames(
"relative -ml-px inline-flex items-center bg-background px-2 py-2 text-foreground shadow-md ring-1 ring-inset ring-ring transition-all duration-500 ease-in-out hover:bg-muted focus:z-10" +
(data.node?.documentation === ""
? " text-muted-foreground"
: " text-foreground")
(data.node?.documentation === ""
? " text-muted-foreground"
: " text-foreground")
)}
target="_blank"
rel="noopener noreferrer"
@ -232,7 +232,7 @@ export default function NodeToolbarComponent({
</SelectItem>
)}
<SelectItem disabled={(!hasApiKey||!validApiKey)} value={"Share"}>
<SelectItem disabled={!hasApiKey || !validApiKey} value={"Share"}>
<div className="flex">
<IconComponent
name="Share2"

View file

@ -275,8 +275,18 @@ export default function StorePage(): JSX.Element {
<SelectContent>
<SelectGroup>
<SelectItem value="all">All</SelectItem>
<SelectItem disabled={!hasApiKey} value="createdbyme">Created By Me</SelectItem>
<SelectItem disabled={!hasApiKey} value="likedbyme">Liked By Me</SelectItem>
<SelectItem
disabled={!hasApiKey || !validApiKey}
value="createdbyme"
>
Created By Me
</SelectItem>
<SelectItem
disabled={!hasApiKey || !validApiKey}
value="likedbyme"
>
Liked By Me
</SelectItem>
</SelectGroup>
</SelectContent>
</Select>

View file

@ -152,8 +152,8 @@ test("PromptTemplateComponent", async ({ page }) => {
)
.click();
await page.getByTestId("more-options-modal").click();
await page.getByTestId("edit-button-modal").click();
await page.getByTestId("more-options-modal").click();
await page.getByTestId("edit-button-modal").click();
await page.locator('//*[@id="showprompt1"]').click();
expect(