From d84bbd25374d4a40c9b0166c23c16487f05d97de Mon Sep 17 00:00:00 2001 From: Manzoor Wani Date: Fri, 30 Aug 2024 21:43:50 -0700 Subject: [PATCH] Fixed conditional rendering of login button (#28) * Fix conditional rendering of login button * Update config and lockfile * Add changelog --- .changeset/poor-buttons-check.md | 5 + package.json | 2 +- packages/react/src/LoginButton.tsx | 16 + pnpm-lock.yaml | 13161 +++++++++++++++------------ 4 files changed, 7366 insertions(+), 5818 deletions(-) create mode 100644 .changeset/poor-buttons-check.md diff --git a/.changeset/poor-buttons-check.md b/.changeset/poor-buttons-check.md new file mode 100644 index 0000000..27ba9ad --- /dev/null +++ b/.changeset/poor-buttons-check.md @@ -0,0 +1,5 @@ +--- +"@telegram-auth/react": patch +--- + +Fixed conditional rendering of login button diff --git a/package.json b/package.json index 0773432..2af94bc 100644 --- a/package.json +++ b/package.json @@ -19,7 +19,7 @@ "dev": "turbo run dev --parallel", "kick-off": "pnpm clean && pnpm build:p", "lint": "eslint \"{packages,examples,internal}/**/*.{ts,tsx,js,jsx,json}\"", - "lint:fix": "pnpm run lint -- --fix", + "lint:fix": "pnpm run lint --fix", "release": "changeset publish", "release:dev": "changeset publish --tag dev", "test": "turbo run test", diff --git a/packages/react/src/LoginButton.tsx b/packages/react/src/LoginButton.tsx index 0a5c440..30bc167 100644 --- a/packages/react/src/LoginButton.tsx +++ b/packages/react/src/LoginButton.tsx @@ -36,6 +36,22 @@ export function LoginButton(props: LoginButtonProps) { // add the script element to the DOM hiddenDivRef.current?.after(scriptRef.current); + + // Save siblings before unmount + const siblings = hiddenDivRef.current?.parentElement?.children || []; + + return () => { + // destroy the script element on unmount + scriptRef.current?.remove(); + + // We also need to remove the rendered iframe + for (const element of siblings) { + if (element instanceof HTMLIFrameElement && element.src.includes('oauth.telegram.org')) { + element.remove(); + break; + } + } + }; }, [props]); return