fix: hot fix for onChange

This commit is contained in:
Salman
2024-03-15 03:04:36 +05:30
parent 1bcc742466
commit 273c78c0a5
@@ -190,7 +190,7 @@ export const SecretInput = forwardRef<HTMLTextAreaElement, Props>(
} }
if (event.key === "{") { if (event.key === "{") {
// auto close the tag // auto close the bracket
const currCaretPos = event.currentTarget.selectionEnd; const currCaretPos = event.currentTarget.selectionEnd;
const isPrevDollar = value[currCaretPos - 2] === "$"; const isPrevDollar = value[currCaretPos - 2] === "$";
if (!isPrevDollar) return; if (!isPrevDollar) return;
@@ -198,6 +198,8 @@ export const SecretInput = forwardRef<HTMLTextAreaElement, Props>(
const newValue = `${value.slice(0, currCaretPos)}}${value.slice(currCaretPos)}`; const newValue = `${value.slice(0, currCaretPos)}}${value.slice(currCaretPos)}`;
setValue(newValue); setValue(newValue);
onChange?.({ target: { value: newValue } } as any);
if (event.currentTarget) { if (event.currentTarget) {
setCaretPos(currCaretPos); setCaretPos(currCaretPos);
setTimeout(() => { setTimeout(() => {
@@ -220,7 +222,6 @@ export const SecretInput = forwardRef<HTMLTextAreaElement, Props>(
handleReferencePopup(event.currentTarget); handleReferencePopup(event.currentTarget);
} }
async function handleReferenceSelect({ async function handleReferenceSelect({
name, name,
type, type,
@@ -250,7 +251,8 @@ export const SecretInput = forwardRef<HTMLTextAreaElement, Props>(
value.slice(referenceEndIndex) value.slice(referenceEndIndex)
]; ];
const oldReferenceStr = oldReference.slice(2, oldReference.length - 1); // remove template let oldReferenceStr = oldReference.slice(2, oldReference.length - 1);
let replaceReference = ""; let replaceReference = "";
let offset = 3; let offset = 3;
switch (type) { switch (type) {
@@ -258,9 +260,11 @@ export const SecretInput = forwardRef<HTMLTextAreaElement, Props>(
replaceReference = `${oldReferenceStr}${name}.`; replaceReference = `${oldReferenceStr}${name}.`;
offset -= 1; offset -= 1;
break; break;
case "secret": case "secret": {
if (oldReferenceStr.indexOf(".") === -1) oldReferenceStr = "";
replaceReference = `${oldReferenceStr}${name}`; replaceReference = `${oldReferenceStr}${name}`;
break; break;
}
case "environment": case "environment":
replaceReference = `${slug}.`; replaceReference = `${slug}.`;
offset -= 1; offset -= 1;
@@ -269,16 +273,18 @@ export const SecretInput = forwardRef<HTMLTextAreaElement, Props>(
} }
newValue = `${start}$\{${replaceReference}}${end}`; newValue = `${start}$\{${replaceReference}}${end}`;
setValue(newValue); setValue(newValue);
onChange?.({ target: { value: newValue } } as any);
setCaretPos(start.length + replaceReference.length + offset); setCaretPos(start.length + replaceReference.length + offset);
if (type !== "secret") extractReference(replaceReference); if (type !== "secret") extractReference(replaceReference);
} }
function handleChange(event: React.ChangeEvent<HTMLTextAreaElement>) { function handleChange(event: React.ChangeEvent<HTMLTextAreaElement>) {
setValue(event.target.value); setValue(event.target.value);
return onChange; if (typeof onChange === "function") onChange(event);
} }
return ( return (
// TODO: hide popup if the focus within the child component left
<div> <div>
<div <div
className={twMerge("w-full overflow-auto rounded-md no-scrollbar", containerClassName)} className={twMerge("w-full overflow-auto rounded-md no-scrollbar", containerClassName)}