Исправлен баг, из-за которого не отображалась кнопка входа через telegram
This commit is contained in:
@@ -28,9 +28,18 @@ export function TelegramLoginButton({
|
||||
onAuth: (user: TelegramUser) => void;
|
||||
}) {
|
||||
const ref = useRef<HTMLDivElement>(null);
|
||||
// onAuth держим в ref, чтобы он НЕ был в зависимостях эффекта: иначе новая инлайн-
|
||||
// функция на каждый рендер пересоздавала бы виджет (а cleanup сносит его innerHTML
|
||||
// в момент отрисовки — в dev со StrictMode кнопка из-за этого не появлялась).
|
||||
const onAuthRef = useRef(onAuth);
|
||||
onAuthRef.current = onAuth;
|
||||
|
||||
useEffect(() => {
|
||||
window.__fsTelegramAuth = (user) => onAuth(user);
|
||||
window.__fsTelegramAuth = (user) => onAuthRef.current(user);
|
||||
const node = ref.current;
|
||||
if (!node) return;
|
||||
node.innerHTML = ""; // на случай повторного монтирования (StrictMode)
|
||||
|
||||
const script = document.createElement("script");
|
||||
script.src = "https://telegram.org/js/telegram-widget.js?22";
|
||||
script.async = true;
|
||||
@@ -39,14 +48,12 @@ export function TelegramLoginButton({
|
||||
script.setAttribute("data-userpic", "false");
|
||||
script.setAttribute("data-request-access", "write");
|
||||
script.setAttribute("data-onauth", "__fsTelegramAuth(user)");
|
||||
node.appendChild(script);
|
||||
|
||||
const node = ref.current;
|
||||
node?.appendChild(script);
|
||||
return () => {
|
||||
if (node) node.innerHTML = "";
|
||||
delete window.__fsTelegramAuth;
|
||||
node.innerHTML = "";
|
||||
};
|
||||
}, [botUsername, onAuth]);
|
||||
}, [botUsername]); // только смена бота пересоздаёт виджет
|
||||
|
||||
return <div ref={ref} />;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user