[Bug]: Cannot read properties of undefined (reading 'version') at openLink

[lxiiiixi]

Telegram Application

Other

Describe the Bug

I used openLink and openTelegramLink, but i got this error.

chunk-IZPIWALI.js:10639 Uncaught TypeError: Cannot read properties of undefined (reading 'version')
    at openLink (@telegram-apps_sdk-r…?v=c792c22f:2152:38)

To Reproduce

1. The version i used is "@telegram-apps/sdk-react": "^1.0.0"
2. I use SDKProvider to wrap the App correctly.
3. I can get the other params from the sdk successfully.

Expected Behavior

The lint should be opend successfully.

[heyqbnk]

Could you share the problematic code?

I assume, you are just losing the context, using this method. Here is the example:

const openLink = utils.openLink;

openLink('...'); 
// you will get the error you specified in the issue, because "this" context is lost

[lxiiiixi]

I'm sorry for replying to your message so late. Here is my code, using the React version of the SDK:

import { Button } from "../Button";
import { useUtils } from "@telegram-apps/sdk-react";

export const InviteFriendsModal = ({ open, onClose }: { open: boolean; onClose: () => void }) => {
    const { openTelegramLink } = useUtils();

    return (
        <BaseModal open={open} onClose={onClose} title="Invite friends">
            <div className="flex flex-col gap-4">
                <Button
                    fullWidth
                    onClick={() => {
                        openTelegramLink(shareLink);
                    }}
                >
                    Share invite link
                </Button>
            </div>
        </BaseModal>
    );
};

[heyqbnk]

You are losing the component context. Try this code:

import { Button } from "../Button";
import { useUtils } from "@telegram-apps/sdk-react";

export const InviteFriendsModal = ({ open, onClose }: { open: boolean; onClose: () => void }) => {
    const utils = useUtils();

    return (
        <BaseModal open={open} onClose={onClose} title="Invite friends">
            <div className="flex flex-col gap-4">
                <Button
                    fullWidth
                    onClick={() => {
                        utils.openTelegramLink(shareLink);
                    }}
                >
                    Share invite link
                </Button>
            </div>
        </BaseModal>
    );
};