diff --git a/package.json b/package.json index a040f7b..7e354ec 100644 --- a/package.json +++ b/package.json @@ -19,11 +19,11 @@ }, "dependencies": { "@solidjs/router": "^0.13.3", - "@telegram-apps/sdk-solid": "^1.0.0", - "@telegram-apps/solid-router-integration": "^1.0.0", + "@telegram-apps/sdk-solid": "^2.0.5", "@tonconnect/ui": "^2.0.2", "eruda": "^3.0.1", - "solid-js": "^1.8.17" + "solid-js": "^1.8.17", + "vite-plugin-mkcert": "^1.17.6" }, "devDependencies": { "@babel/core": "^7.24.4", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 563b7a0..df0a1b8 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -12,11 +12,8 @@ importers: specifier: ^0.13.3 version: 0.13.3(solid-js@1.8.17) '@telegram-apps/sdk-solid': - specifier: ^1.0.0 - version: 1.0.0(solid-js@1.8.17) - '@telegram-apps/solid-router-integration': - specifier: ^1.0.0 - version: 1.0.0(@solidjs/router@0.13.3(solid-js@1.8.17))(@telegram-apps/sdk@1.0.0)(solid-js@1.8.17) + specifier: ^2.0.5 + version: 2.0.5(solid-js@1.8.17) '@tonconnect/ui': specifier: ^2.0.2 version: 2.0.2 @@ -26,6 +23,9 @@ importers: solid-js: specifier: ^1.8.17 version: 1.8.17 + vite-plugin-mkcert: + specifier: ^1.17.6 + version: 1.17.6(vite@5.2.11) devDependencies: '@babel/core': specifier: ^7.24.4 @@ -873,6 +873,58 @@ packages: '@nothing-but/utils@0.12.1': resolution: {integrity: sha512-1qZU1Q5El0IjE7JT/ucvJNzdr2hL3W8Rm27xNf1p6gb3Nw8pGnZmxp6/GEW9h+I1k1cICxXNq25hBwknTQ7yhg==} + '@octokit/auth-token@4.0.0': + resolution: {integrity: sha512-tY/msAuJo6ARbK6SPIxZrPBms3xPbfwBrulZe0Wtr/DIY9lje2HeV1uoebShn6mx7SjCHif6EjMvoREj+gZ+SA==} + engines: {node: '>= 18'} + + '@octokit/core@5.2.0': + resolution: {integrity: sha512-1LFfa/qnMQvEOAdzlQymH0ulepxbxnCYAKJZfMci/5XJyIHWgEYnDmgnKakbTh7CH2tFQ5O60oYDvns4i9RAIg==} + engines: {node: '>= 18'} + + '@octokit/endpoint@9.0.5': + resolution: {integrity: sha512-ekqR4/+PCLkEBF6qgj8WqJfvDq65RH85OAgrtnVp1mSxaXF03u2xW/hUdweGS5654IlC0wkNYC18Z50tSYTAFw==} + engines: {node: '>= 18'} + + '@octokit/graphql@7.1.0': + resolution: {integrity: sha512-r+oZUH7aMFui1ypZnAvZmn0KSqAUgE1/tUXIWaqUCa1758ts/Jio84GZuzsvUkme98kv0WFY8//n0J1Z+vsIsQ==} + engines: {node: '>= 18'} + + '@octokit/openapi-types@22.2.0': + resolution: {integrity: sha512-QBhVjcUa9W7Wwhm6DBFu6ZZ+1/t/oYxqc2tp81Pi41YNuJinbFRx8B133qVOrAaBbF7D/m0Et6f9/pZt9Rc+tg==} + + '@octokit/plugin-paginate-rest@11.3.1': + resolution: {integrity: sha512-ryqobs26cLtM1kQxqeZui4v8FeznirUsksiA+RYemMPJ7Micju0WSkv50dBksTuZks9O5cg4wp+t8fZ/cLY56g==} + engines: {node: '>= 18'} + peerDependencies: + '@octokit/core': '5' + + '@octokit/plugin-request-log@4.0.1': + resolution: {integrity: sha512-GihNqNpGHorUrO7Qa9JbAl0dbLnqJVrV8OXe2Zm5/Y4wFkZQDfTreBzVmiRfJVfE4mClXdihHnbpyyO9FSX4HA==} + engines: {node: '>= 18'} + peerDependencies: + '@octokit/core': '5' + + '@octokit/plugin-rest-endpoint-methods@13.2.2': + resolution: {integrity: sha512-EI7kXWidkt3Xlok5uN43suK99VWqc8OaIMktY9d9+RNKl69juoTyxmLoWPIZgJYzi41qj/9zU7G/ljnNOJ5AFA==} + engines: {node: '>= 18'} + peerDependencies: + '@octokit/core': ^5 + + '@octokit/request-error@5.1.0': + resolution: {integrity: sha512-GETXfE05J0+7H2STzekpKObFe765O5dlAKUTLNGeH+x47z7JjXHfsHKo5z21D/o/IOZTUEI6nyWyR+bZVP/n5Q==} + engines: {node: '>= 18'} + + '@octokit/request@8.4.0': + resolution: {integrity: sha512-9Bb014e+m2TgBeEJGEbdplMVWwPmL1FPtggHQRkV+WVsMggPtEkLKPlcVYm/o8xKLkpJ7B+6N8WfQMtDLX2Dpw==} + engines: {node: '>= 18'} + + '@octokit/rest@20.1.1': + resolution: {integrity: sha512-MB4AYDsM5jhIHro/dq4ix1iWTLGToIGk6cWF5L6vanFaMble5jTX/UBQyiv05HsWnwUtY8JrfHy2LWfKwihqMw==} + engines: {node: '>= 18'} + + '@octokit/types@13.6.1': + resolution: {integrity: sha512-PHZE9Z+kWXb23Ndik8MKPirBPziOc0D2/3KH1P+6jK5nGWe96kadZuE4jev2/Jq7FvIfTlT2Ltg8Fv2x1v0a5g==} + '@rollup/rollup-android-arm-eabi@4.14.1': resolution: {integrity: sha512-fH8/o8nSUek8ceQnT7K4EQbSiV7jgkHq81m9lWZFIXjJ7lJzpWXbQFpT/Zh6OZYnpFykvzC3fbEvEAFZu03dPA==} cpu: [arm] @@ -1038,20 +1090,31 @@ packages: peerDependencies: solid-js: ^1.8.6 - '@telegram-apps/sdk-solid@1.0.0': - resolution: {integrity: sha512-OTcPkVTotiXZp7koJwSyOuNcKVUVFZqhOhOzE1e/qZWoGY3UsGldQ2lU8aAyiP/zUZW7fleixaNtbvgmFEw4xg==} + '@telegram-apps/bridge@1.2.1': + resolution: {integrity: sha512-nNri01sAIDqDPPV1dBwB5/U0dWhm5URInY8jcY39BuRqbC4mjwf7xJmRwO67MYxncwSqacBW43ILIrpv8PQyrQ==} + + '@telegram-apps/navigation@1.0.3': + resolution: {integrity: sha512-v1BPs0GrV7GhbTYWbFw7tUJj0dLR8+LdEBSzQmpEF1KK+6gmPrgGxQ0U9FzZ/jOiJlzcGNz/pLF8PEpoVzrQnA==} + + '@telegram-apps/sdk-solid@2.0.5': + resolution: {integrity: sha512-c5QftpIu9GtCO50uu+/DcjJj2nuBYvjb3np7sqPRGTQ8mY/Dm7ihFVw8p0CZprxTMlKmpfnzjRuxF+MH+3H7lg==} peerDependencies: solid-js: ^1.0.0 - '@telegram-apps/sdk@1.0.0': - resolution: {integrity: sha512-lnmYrmti4hF1AuVVflkgHpVSsnwhPnukuc2sM5AZ4eKVM6ZMzPpeZtHyEdft5GqxgmePhN8+sTJuQRbvqCJvjQ==} + '@telegram-apps/sdk@2.4.0': + resolution: {integrity: sha512-TqGheu3jVZj3Dv0wrZ81J+ojLWuOrnpHXecl8c8StrpjdCReV4WUtd00Mfu4IWakOyR1qE5Ohgv7cQvrkAisyA==} - '@telegram-apps/solid-router-integration@1.0.0': - resolution: {integrity: sha512-+FHBsJzqPXwWFVIJxXf8ZADCcSLHlayUZKMfwEvPNUrTpDM8Px5FrLHew2NRIB0q0+eT2rKzyycn9IFR8RzkUg==} - peerDependencies: - '@solidjs/router': ^0.13.1 - '@telegram-apps/sdk': ^1.0.0 - solid-js: ^1.8.16 + '@telegram-apps/signals@1.0.1': + resolution: {integrity: sha512-+DAltcPtLBeNPjX+BxEh9smh0cbxCXuEcsOEyDCovp6HJHusWFv1tDyJuV0/rXFmcDs+VwU7SjmINdjld2nFHw==} + + '@telegram-apps/toolkit@1.0.0': + resolution: {integrity: sha512-fSVoveLuMzwRKWeXEufMSXxH+HvjsFKb1DeT3pG5qLpnb2rdtejnNcwAt6WEPtiZ3a4YntYaFuR3KYgVv0ZxeQ==} + + '@telegram-apps/transformers@1.0.1': + resolution: {integrity: sha512-SsI+FhCOkkZFUPqr+ib11Fi25fRCpdMsI2Flp51NrdtKaPDnKFkBBG4GcSEaGL8sXquW9uAANjc499jSaZK5jQ==} + + '@telegram-apps/types@1.0.1': + resolution: {integrity: sha512-8tGy1zG/1MEt0KF8nR0ffZ93whKveEJIkBI+qxHCRgatKwKVJV2dVSXrrBspFKn7FIIo1/CvmB8zP4vKPzglbg==} '@tonconnect/isomorphic-eventsource@0.0.2': resolution: {integrity: sha512-B4UoIjPi0QkvIzZH5fV3BQLWrqSYABdrzZQSI9sJA9aA+iC0ohOzFwVVGXanlxeDAy1bcvPbb29f6sVUk0UnnQ==} @@ -1168,6 +1231,12 @@ packages: async@3.2.5: resolution: {integrity: sha512-baNZyqaaLhyLVKm/DlvdW051MSgO6b8eVfIezl9E5PqWxFgzLm/wQntEW4zOytVburDEr0JlALEpdOFwvErLsg==} + asynckit@0.4.0: + resolution: {integrity: sha512-Oei9OH4tRh0YqU3GxhX79dM/mwVgvbZJaSNaRk+bshkj0S5cfHcgYakreBjrHwatXKbz+IoIdYLxrKim2MjW0Q==} + + axios@1.7.7: + resolution: {integrity: sha512-S4kL7XrjgBmvdGut0sN3yJxqYzrDOnivkBiN0OFs6hLiUam3UPvswUo0kqGyhqUZGEOytHyumEdXsAkgCOUf3Q==} + babel-plugin-jsx-dom-expressions@0.37.20: resolution: {integrity: sha512-0L3aC5EFyvCgIlEYIqJb4Ym29s1IDI/U5SntZ1ZK054xe0MqBmBi2GLK3f9AOklhdY7kCC3GsHD0bILh6u0Qsg==} peerDependencies: @@ -1196,6 +1265,9 @@ packages: balanced-match@1.0.2: resolution: {integrity: sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==} + before-after-hook@2.2.3: + resolution: {integrity: sha512-NzUnlZexiaH/46WDhANlyR2bXRopNg4F/zuSA3OpZnllCUgRaOF2znDioDWrmbNVsuZk6l9pMquQB38cfBZwkQ==} + brace-expansion@1.1.11: resolution: {integrity: sha512-iCuPHDFgrHX7H2vEI/5xpz07zSHB00TpugqhmYtVmMO6518mCuRMoOYFldEBl0g187ufozdaHgWKcYFb61qGiA==} @@ -1242,6 +1314,10 @@ packages: color-name@1.1.4: resolution: {integrity: sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==} + combined-stream@1.0.8: + resolution: {integrity: sha512-FQN4MRfuJeHf7cBbBMJFXhKSDq+2kAArBlmRBvcvFE5BB1HZKXtSFASDhdlz9zOYwxh8lDdnvmMOe/+5cdoEdg==} + engines: {node: '>= 0.8'} + commander@11.1.0: resolution: {integrity: sha512-yPVavfyCcRhmorC7rWlkHn15b4wDVgVmBA7kV4QVBsF7kv/9TKJAbAXVTxvTnwP8HHKjRCJDClKbciiYS7p0DQ==} engines: {node: '>=16'} @@ -1274,6 +1350,15 @@ packages: supports-color: optional: true + debug@4.3.7: + resolution: {integrity: sha512-Er2nc/H7RrMXZBFCEim6TCmMk02Z8vLC2Rbi1KEBggpo0fS6l0S1nnapwmIi3yW/+GOJap1Krg4w0Hg80oCqgQ==} + engines: {node: '>=6.0'} + peerDependencies: + supports-color: '*' + peerDependenciesMeta: + supports-color: + optional: true + deep-is@0.1.4: resolution: {integrity: sha512-oIPzksmTg4/MriiaYGO+okXDT7ztn/w3Eptv/+gSIdMdKsJo0u4CfYNFJPy+4SKMuCqGw2wxnA+URMg3t8a/bQ==} @@ -1281,6 +1366,13 @@ packages: resolution: {integrity: sha512-3sUqbMEc77XqpdNO7FRyRog+eW3ph+GYCbj+rK+uYyRMuwsVy0rMiVtPn+QJlKFvWP/1PYpapqYn0Me2knFn+A==} engines: {node: '>=0.10.0'} + delayed-stream@1.0.0: + resolution: {integrity: sha512-ZySD7Nf91aLB0RxL4KGrKHBXl7Eds1DAmEdcoVawXnLD7SDhpNgtuII2aAkg7a7QS41jxPSZ17p4VdGnMHk3MQ==} + engines: {node: '>=0.4.0'} + + deprecation@2.3.1: + resolution: {integrity: sha512-xmHIy4F3scKVwMsQ4WnVaS8bHOx0DmVwRywosKhaILI0ywMDWPtBSku2HNxRvF7jtwDRsoEwYQSfbxj8b7RlJQ==} + dir-glob@3.0.1: resolution: {integrity: sha512-WkrWp9GR4KXfKGYzOLmTuGVi1UWFfws377n9cc55/tb6DuqyF6pcQ5AbiHEshaDpY9v6oaSr2XCDidGmMwdzIA==} engines: {node: '>=8'} @@ -1421,6 +1513,19 @@ packages: flatted@3.3.1: resolution: {integrity: sha512-X8cqMLLie7KsNUDSdzeN8FYK9rEt4Dt67OsG/DNGnYTSDBG4uFAJFBnUeiV+zCVAvwFy56IjM9sH51jVaEhNxw==} + follow-redirects@1.15.9: + resolution: {integrity: sha512-gew4GsXizNgdoRyqmyfMHyAmXsZDk6mHkSxZFCzW9gwlbtOW44CDtYavM+y+72qD/Vq2l550kMF52DT8fOLJqQ==} + engines: {node: '>=4.0'} + peerDependencies: + debug: '*' + peerDependenciesMeta: + debug: + optional: true + + form-data@4.0.1: + resolution: {integrity: sha512-tzN8e4TX8+kkxGPK8D5u0FNmjPUjw3lwC9lSLxxoB/+GtsJG91CO8bSWy73APlgAZzZbXEYZJuxjkHH2w+Ezhw==} + engines: {node: '>= 6'} + fs-extra@11.2.0: resolution: {integrity: sha512-PmDi3uwK5nFuXh7XDTlVnS17xJS7vW36is2+w3xcv8SVxiB4NyATf4ctkVY5bkSjX0Y4nbvZCq1/EjtEyr9ktw==} engines: {node: '>=14.14'} @@ -1631,6 +1736,14 @@ packages: resolution: {integrity: sha512-DMy+ERcEW2q8Z2Po+WNXuw3c5YaUSFjAO5GsJqfEl7UjvtIuFKO6ZrKvcItdy98dwFI2N1tg3zNIdKaQT+aNdA==} engines: {node: '>=8.6'} + mime-db@1.52.0: + resolution: {integrity: sha512-sPU4uV7dYlvtWJxwwxHD0PuihVNiE7TyAbQ5SWxDCB9mUYvOgroQOwYQQOKPJ8CIbE+1ETVlOoK1UC2nU3gYvg==} + engines: {node: '>= 0.6'} + + mime-types@2.1.35: + resolution: {integrity: sha512-ZDY+bPm5zTTF+YpCrAU9nK0UgICYPT0QtT1NZWFv4s++TNkcgVaT0g6+4R2uI4MjQjzysHB1zxuWL50hzaeXiw==} + engines: {node: '>= 0.6'} + minimatch@3.1.2: resolution: {integrity: sha512-J7p63hRiAjw1NDEww1W7i37+ByIrOWO5XQQAzZ3VOcL0PNybwpfmV/N05zFAzwQ9USyEcX6t3UO+K5aqBQOIHw==} @@ -1641,6 +1754,9 @@ packages: ms@2.1.2: resolution: {integrity: sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w==} + ms@2.1.3: + resolution: {integrity: sha512-6FlzubTLZG3J2a/NVCAleEhjzq5oxgHyaCU9yYXvcLsvoVaHJq/s5xXI6/XXP6tz7R9xAOtHnSO/tXtF3WRTlA==} + nanoid@3.3.7: resolution: {integrity: sha512-eSRppjcPIatRIMC1U6UngP8XFcz8MQWGQdt1MTBQ7NaAmvXDfvNxbvWV3x2y6CdEUciCSsDHDQZbhYaB8QEo2g==} engines: {node: ^10 || ^12 || ^13.7 || ^14 || >=15.0.1} @@ -1718,6 +1834,9 @@ packages: picocolors@1.0.0: resolution: {integrity: sha512-1fygroTLlHu66zi26VoTDv8yRgm0Fccecssto+MhsZ0D/DGW2sm8E8AjW7NU5VVTRt5GxbeZ5qBuJr+HyLYkjQ==} + picocolors@1.1.0: + resolution: {integrity: sha512-TQ92mBOW0l3LeMeyLV6mzy/kWr8lkd/hp3mTg7wYK7zJhuBStmGMBG0BdeDZS/dZx1IukaX6Bk11zcln25o1Aw==} + picomatch@2.3.1: resolution: {integrity: sha512-JU3teHTNjmE2VCGFzuY8EXzCDVwEqB2a8fsIvwaStHhAWJEeVd1o1QD80CU6+ZdEXXSLbSsuLwJjkCBWqRQUVA==} engines: {node: '>=8.6'} @@ -1746,6 +1865,9 @@ packages: resolution: {integrity: sha512-vkcDPrRZo1QZLbn5RLGPpg/WmIQ65qoWWhcGKf/b5eplkkarX0m9z8ppCat4mlOqUsWpyNuYgO3VRyrYHSzX5g==} engines: {node: '>= 0.8.0'} + proxy-from-env@1.1.0: + resolution: {integrity: sha512-D+zkORCbA9f1tdWRK0RaCR3GPv50cMxcrz4X8k5LTSUD1Dkw47mKJEZQNunItRTkWwgtaUSo1RVFRIG9ZXiFYg==} + punycode@2.3.1: resolution: {integrity: sha512-vYt7UD1U9Wg6138shLtLOvdAu+8DsC/ilFtEVHcH+wydcSpNE20AfSOduf6MkRFahL5FY7X1oU7nKVZFtfq8Fg==} engines: {node: '>=6'} @@ -1942,6 +2064,9 @@ packages: resolution: {integrity: sha512-6t3foTQI9qne+OZoVQB/8x8rk2k1eVy1gRXhV3oFQ5T6R1dqQ1xtin3XqSlx3+ATBkliTaR/hHyJBm+LVPNM8w==} engines: {node: '>=4'} + universal-user-agent@6.0.1: + resolution: {integrity: sha512-yCzhz6FN2wU1NiiQRogkTQszlQSlpWaw8SvVegAc+bDxbzHgh1vX8uIe8OYyMH6DwH+sdTJsgMl36+mSMdRJIQ==} + universalify@2.0.1: resolution: {integrity: sha512-gptHNQghINnc/vTGIk0SOFGFNXw7JVrlRUtConJRlvaw6DuX0wO5Jeko9sWrMBhh+PsYAZ7oXAiOnf/UKogyiw==} engines: {node: '>= 10.0.0'} @@ -1958,6 +2083,12 @@ packages: validate-html-nesting@1.2.2: resolution: {integrity: sha512-hGdgQozCsQJMyfK5urgFcWEqsSSrK63Awe0t/IMR0bZ0QMtnuaiHzThW81guu3qx9abLi99NEuiaN6P9gVYsNg==} + vite-plugin-mkcert@1.17.6: + resolution: {integrity: sha512-4JR1RN0HEg/w17eRQJ/Ve2pSa6KCVQcQO6yKtIaKQCFDyd63zGfXHWpygBkvvRSpqa0GcqNKf0fjUJ0HiJQXVQ==} + engines: {node: '>=v16.7.0'} + peerDependencies: + vite: '>=3' + vite-plugin-solid@2.10.2: resolution: {integrity: sha512-AOEtwMe2baBSXMXdo+BUwECC8IFHcKS6WQV/1NEd+Q7vHPap5fmIhLcAzr+DUJ04/KHx/1UBU0l1/GWP+rMAPQ==} peerDependencies: @@ -2907,6 +3038,69 @@ snapshots: '@nothing-but/utils@0.12.1': {} + '@octokit/auth-token@4.0.0': {} + + '@octokit/core@5.2.0': + dependencies: + '@octokit/auth-token': 4.0.0 + '@octokit/graphql': 7.1.0 + '@octokit/request': 8.4.0 + '@octokit/request-error': 5.1.0 + '@octokit/types': 13.6.1 + before-after-hook: 2.2.3 + universal-user-agent: 6.0.1 + + '@octokit/endpoint@9.0.5': + dependencies: + '@octokit/types': 13.6.1 + universal-user-agent: 6.0.1 + + '@octokit/graphql@7.1.0': + dependencies: + '@octokit/request': 8.4.0 + '@octokit/types': 13.6.1 + universal-user-agent: 6.0.1 + + '@octokit/openapi-types@22.2.0': {} + + '@octokit/plugin-paginate-rest@11.3.1(@octokit/core@5.2.0)': + dependencies: + '@octokit/core': 5.2.0 + '@octokit/types': 13.6.1 + + '@octokit/plugin-request-log@4.0.1(@octokit/core@5.2.0)': + dependencies: + '@octokit/core': 5.2.0 + + '@octokit/plugin-rest-endpoint-methods@13.2.2(@octokit/core@5.2.0)': + dependencies: + '@octokit/core': 5.2.0 + '@octokit/types': 13.6.1 + + '@octokit/request-error@5.1.0': + dependencies: + '@octokit/types': 13.6.1 + deprecation: 2.3.1 + once: 1.4.0 + + '@octokit/request@8.4.0': + dependencies: + '@octokit/endpoint': 9.0.5 + '@octokit/request-error': 5.1.0 + '@octokit/types': 13.6.1 + universal-user-agent: 6.0.1 + + '@octokit/rest@20.1.1': + dependencies: + '@octokit/core': 5.2.0 + '@octokit/plugin-paginate-rest': 11.3.1(@octokit/core@5.2.0) + '@octokit/plugin-request-log': 4.0.1(@octokit/core@5.2.0) + '@octokit/plugin-rest-endpoint-methods': 13.2.2(@octokit/core@5.2.0) + + '@octokit/types@13.6.1': + dependencies: + '@octokit/openapi-types': 22.2.0 + '@rollup/rollup-android-arm-eabi@4.14.1': optional: true @@ -3069,19 +3263,42 @@ snapshots: dependencies: solid-js: 1.8.17 - '@telegram-apps/sdk-solid@1.0.0(solid-js@1.8.17)': + '@telegram-apps/bridge@1.2.1': dependencies: - '@telegram-apps/sdk': 1.0.0 - solid-js: 1.8.17 + '@telegram-apps/signals': 1.0.1 + '@telegram-apps/toolkit': 1.0.0 + '@telegram-apps/transformers': 1.0.1 + '@telegram-apps/types': 1.0.1 - '@telegram-apps/sdk@1.0.0': {} + '@telegram-apps/navigation@1.0.3': + dependencies: + '@telegram-apps/bridge': 1.2.1 + '@telegram-apps/signals': 1.0.1 + '@telegram-apps/toolkit': 1.0.0 - '@telegram-apps/solid-router-integration@1.0.0(@solidjs/router@0.13.3(solid-js@1.8.17))(@telegram-apps/sdk@1.0.0)(solid-js@1.8.17)': + '@telegram-apps/sdk-solid@2.0.5(solid-js@1.8.17)': dependencies: - '@solidjs/router': 0.13.3(solid-js@1.8.17) - '@telegram-apps/sdk': 1.0.0 + '@telegram-apps/sdk': 2.4.0 solid-js: 1.8.17 + '@telegram-apps/sdk@2.4.0': + dependencies: + '@telegram-apps/bridge': 1.2.1 + '@telegram-apps/navigation': 1.0.3 + '@telegram-apps/signals': 1.0.1 + '@telegram-apps/transformers': 1.0.1 + + '@telegram-apps/signals@1.0.1': {} + + '@telegram-apps/toolkit@1.0.0': {} + + '@telegram-apps/transformers@1.0.1': + dependencies: + '@telegram-apps/toolkit': 1.0.0 + '@telegram-apps/types': 1.0.1 + + '@telegram-apps/types@1.0.1': {} + '@tonconnect/isomorphic-eventsource@0.0.2': dependencies: eventsource: 2.0.2 @@ -3223,6 +3440,16 @@ snapshots: async@3.2.5: {} + asynckit@0.4.0: {} + + axios@1.7.7(debug@4.3.7): + dependencies: + follow-redirects: 1.15.9(debug@4.3.7) + form-data: 4.0.1 + proxy-from-env: 1.1.0 + transitivePeerDependencies: + - debug + babel-plugin-jsx-dom-expressions@0.37.20(@babel/core@7.24.4): dependencies: '@babel/core': 7.24.4 @@ -3263,6 +3490,8 @@ snapshots: balanced-match@1.0.2: {} + before-after-hook@2.2.3: {} + brace-expansion@1.1.11: dependencies: balanced-match: 1.0.2 @@ -3312,6 +3541,10 @@ snapshots: color-name@1.1.4: {} + combined-stream@1.0.8: + dependencies: + delayed-stream: 1.0.0 + commander@11.1.0: {} commondir@1.0.1: {} @@ -3336,10 +3569,18 @@ snapshots: dependencies: ms: 2.1.2 + debug@4.3.7: + dependencies: + ms: 2.1.3 + deep-is@0.1.4: {} deepmerge@4.3.1: {} + delayed-stream@1.0.0: {} + + deprecation@2.3.1: {} + dir-glob@3.0.1: dependencies: path-type: 4.0.0 @@ -3536,6 +3777,16 @@ snapshots: flatted@3.3.1: {} + follow-redirects@1.15.9(debug@4.3.7): + optionalDependencies: + debug: 4.3.7 + + form-data@4.0.1: + dependencies: + asynckit: 0.4.0 + combined-stream: 1.0.8 + mime-types: 2.1.35 + fs-extra@11.2.0: dependencies: graceful-fs: 4.2.11 @@ -3729,6 +3980,12 @@ snapshots: braces: 3.0.2 picomatch: 2.3.1 + mime-db@1.52.0: {} + + mime-types@2.1.35: + dependencies: + mime-db: 1.52.0 + minimatch@3.1.2: dependencies: brace-expansion: 1.1.11 @@ -3739,6 +3996,8 @@ snapshots: ms@2.1.2: {} + ms@2.1.3: {} + nanoid@3.3.7: {} natural-compare@1.4.0: {} @@ -3798,6 +4057,8 @@ snapshots: picocolors@1.0.0: {} + picocolors@1.1.0: {} + picomatch@2.3.1: {} pify@2.3.0: {} @@ -3820,6 +4081,8 @@ snapshots: prelude-ls@1.2.1: {} + proxy-from-env@1.1.0: {} + punycode@2.3.1: {} queue-microtask@1.2.3: {} @@ -4003,6 +4266,8 @@ snapshots: unicode-property-aliases-ecmascript@2.1.0: {} + universal-user-agent@6.0.1: {} + universalify@2.0.1: {} update-browserslist-db@1.0.13(browserslist@4.23.0): @@ -4017,6 +4282,16 @@ snapshots: validate-html-nesting@1.2.2: {} + vite-plugin-mkcert@1.17.6(vite@5.2.11): + dependencies: + '@octokit/rest': 20.1.1 + axios: 1.7.7(debug@4.3.7) + debug: 4.3.7 + picocolors: 1.1.0 + vite: 5.2.11 + transitivePeerDependencies: + - supports-color + vite-plugin-solid@2.10.2(solid-js@1.8.17)(vite@5.2.11): dependencies: '@babel/core': 7.24.4 diff --git a/src/components/App.jsx b/src/components/App.jsx index d179ad9..b6603f3 100644 --- a/src/components/App.jsx +++ b/src/components/App.jsx @@ -1,54 +1,15 @@ -import { Navigate, Route } from '@solidjs/router'; -import { - initNavigator, - bindMiniAppCSSVars, - bindThemeParamsCSSVars, - bindViewportCSSVars, - useMiniApp, - useThemeParams, - useViewport, -} from '@telegram-apps/sdk-solid'; -import { createRouter } from '@telegram-apps/solid-router-integration'; -import { createEffect, For, onCleanup } from 'solid-js'; +import { Navigate, Route, HashRouter } from '@solidjs/router'; +import { For } from 'solid-js'; import { routes } from '@/navigation/routes.jsx'; -/** - * @returns {Node | JSX.ArrayElement | string | number | boolean} - */ export function App() { - const miniApp = useMiniApp(); - const themeParams = useThemeParams(); - const viewport = useViewport(); - - createEffect(() => { - onCleanup(bindMiniAppCSSVars(miniApp(), themeParams())); - }); - createEffect(() => { - onCleanup(bindThemeParamsCSSVars(themeParams())); - }); - createEffect(() => { - const vp = viewport(); - vp && onCleanup(bindViewportCSSVars(vp)); - }); - - // Create new application navigator and attach it to the browser history, so it could modify - // it and listen to its changes. - const navigator = initNavigator('app-navigator-state'); - void navigator.attach(); - - onCleanup(() => { - navigator.detach(); - }); - - const Router = createRouter(navigator); - return ( - + {(route) => } - }/> - + }/> + ); } diff --git a/src/components/Link/Link.jsx b/src/components/Link/Link.jsx index 420bde3..f4ccb01 100644 --- a/src/components/Link/Link.jsx +++ b/src/components/Link/Link.jsx @@ -1,5 +1,5 @@ import { A } from '@solidjs/router'; -import { classNames, useUtils } from '@telegram-apps/sdk-solid'; +import { classNames, openLink } from '@telegram-apps/sdk-solid'; import './Link.css'; @@ -8,11 +8,6 @@ import './Link.css'; * @return {import('solid-js').JSXElement} */ export function Link(props) { - const utils = useUtils(); - - /** - * @param {MouseEvent} e - */ const onClick = (e) => { // Compute if target path is external. In this case we would like to open link using // TMA method. @@ -23,7 +18,7 @@ export function Link(props) { if (isExternal) { e.preventDefault(); - return utils().openLink(targetUrl.toString()); + openLink(targetUrl.toString()); } }; diff --git a/src/components/Page/Page.jsx b/src/components/Page/Page.jsx index 2a4d074..3d43ea7 100644 --- a/src/components/Page/Page.jsx +++ b/src/components/Page/Page.jsx @@ -1,17 +1,23 @@ -import './Page.css'; +import { createEffect } from 'solid-js'; +import { backButton } from '@telegram-apps/sdk-solid'; + +import { useNavigate } from '@solidjs/router'; -/** - * @typedef PageProps - * @property {String} title - * @property {import('solid-js').JSXElement} [disclaimer] - * @property {import('solid-js').JSXElement} [children] - */ +import './Page.css'; -/** - * @param {PageProps} props - * @return {import('solid-js').JSXElement} - */ export function Page(props) { + const navigate = useNavigate(); + + createEffect(() => { + if (props.back) { + backButton.show(); + return backButton.onClick(() => { + navigate(-1); + }); + } + backButton.hide(); + }); + return (

{props.title}

diff --git a/src/components/Root.jsx b/src/components/Root.jsx index ff97879..4e88477 100644 --- a/src/components/Root.jsx +++ b/src/components/Root.jsx @@ -1,58 +1,36 @@ -import { retrieveLaunchParams, SDKProvider } from '@telegram-apps/sdk-solid'; import { ErrorBoundary, Switch, Match } from 'solid-js'; import { App } from '@/components/App.jsx'; import { TonConnectUIProvider } from '@/tonconnect/TonConnectUIProvider.jsx'; +import { publicUrl } from '@/helpers/publicUrl.js'; -/** - * @returns {Node | JSX.ArrayElement | string | number | boolean} - */ -function Inner() { - const debug = retrieveLaunchParams().startParam === 'debug'; - if (debug) { - import('eruda').then((lib) => lib.default.init()); - } - +function ErrorBoundaryError(props) { return ( - - - - - +
+

ErrorBoundary handled error:

+
+ + + + {v => v()} + + + {v => v()} + + + +
+
); } -/** - * @returns {Node | JSX.ArrayElement | string | number | boolean} - */ export function Root() { return ( - { - console.error('ErrorBoundary handled error:', err); - - return ( -
-

ErrorBoundary handled error:

-
- - - - {v => v()} - - - {v => v()} - - - -
-
- ); - }} - > - + + + + ); } diff --git a/src/helpers/publicUrl.js b/src/helpers/publicUrl.js new file mode 100644 index 0000000..1ea0d13 --- /dev/null +++ b/src/helpers/publicUrl.js @@ -0,0 +1,11 @@ +/** + * @returns A complete public URL prefixed with the public static assets base + * path. + * @param path - path to prepend prefix to + */ +export function publicUrl(path) { + return new URL( + path.replace(/^\/+/, ''), + window.location.origin + import.meta.env.BASE_URL + ).toString(); +} \ No newline at end of file diff --git a/src/index.jsx b/src/index.jsx index 2a88c6b..6478fa7 100644 --- a/src/index.jsx +++ b/src/index.jsx @@ -1,10 +1,18 @@ /* @refresh reload */ import { render } from 'solid-js/web'; +import { retrieveLaunchParams } from '@telegram-apps/sdk-solid'; import { Root } from '@/components/Root.jsx'; +import { init } from '@/init.js'; import './index.css'; +// Mock the environment in case, we are outside Telegram. +import './mockEnv.js'; + +// Configure all application dependencies. +init(retrieveLaunchParams().startParam === 'debug' || import.meta.env.DEV); + const root = document.getElementById('root'); if (import.meta.env.DEV && !(root instanceof HTMLElement)) { diff --git a/src/init.js b/src/init.js new file mode 100644 index 0000000..2083a6b --- /dev/null +++ b/src/init.js @@ -0,0 +1,40 @@ +import { + backButton, + viewport, + themeParams, + miniApp, + initData, + $debug, + init as initSDK, +} from '@telegram-apps/sdk-solid'; + +/** + * Initializes the application and configures its dependencies. + */ +export function init(debug) { + // Set @telegram-apps/sdk-react debug mode. + $debug.set(debug); + + // Initialize special event handlers for Telegram Desktop, Android, iOS, etc. + // Also, configure the package. + initSDK(); + + // Mount all components used in the project. + backButton.isSupported() && backButton.mount(); + miniApp.mount(); + themeParams.mount(); + initData.restore(); + void viewport.mount().catch(e => { + console.error('Something went wrong mounting the viewport', e); + }); + + // Define components-related CSS variables. + viewport.bindCssVars(); + miniApp.bindCssVars(); + themeParams.bindCssVars(); + + // Add Eruda if needed. + debug && import('eruda') + .then((lib) => lib.default.init()) + .catch(console.error); +} \ No newline at end of file diff --git a/src/mockEnv.js b/src/mockEnv.js new file mode 100644 index 0000000..3ff279d --- /dev/null +++ b/src/mockEnv.js @@ -0,0 +1,70 @@ +import { + mockTelegramEnv, + isTMA, + parseInitData, + retrieveLaunchParams +} from '@telegram-apps/sdk-solid'; + +// It is important, to mock the environment only for development purposes. +// When building the application the import.meta.env.DEV will value become +// `false` and the code inside will be tree-shaken (removed), so you will not +// see it in your final bundle. +if (import.meta.env.DEV) { + await (async () => { + if (await isTMA()) { + return; + } + + // Determine which launch params should be applied. We could already + // apply them previously, or they may be specified on purpose using the + // default launch parameters transmission method. + let lp; + try { + lp = retrieveLaunchParams(); + } catch (e) { + const initDataRaw = new URLSearchParams([ + ['user', JSON.stringify({ + id: 99281932, + first_name: 'Andrew', + last_name: 'Rogue', + username: 'rogue', + language_code: 'en', + is_premium: true, + allows_write_to_pm: true, + })], + ['hash', '89d6079ad6762351f38c6dbbc41bb53048019256a9443988af7a48bcad16ba31'], + ['auth_date', '1716922846'], + ['start_param', 'debug'], + ['chat_type', 'sender'], + ['chat_instance', '8428209589180549439'], + ]).toString(); + + lp = { + themeParams: { + accentTextColor: '#6ab2f2', + bgColor: '#17212b', + buttonColor: '#5288c1', + buttonTextColor: '#ffffff', + destructiveTextColor: '#ec3942', + headerBgColor: '#17212b', + hintColor: '#708499', + linkColor: '#6ab3f3', + secondaryBgColor: '#232e3c', + sectionBgColor: '#17212b', + sectionHeaderTextColor: '#6ab3f3', + subtitleTextColor: '#708499', + textColor: '#f5f5f5', + }, + initData: parseInitData(initDataRaw), + initDataRaw, + version: '8', + platform: 'tdesktop', + } + } + + mockTelegramEnv(lp); + console.warn( + '⚠️ As long as the current environment was not considered as the Telegram-based one, it was mocked. Take a note, that you should not do it in production and current behavior is only specific to the development process. Environment mocking is also applied only in development mode. So, after building the application, you will not see this behavior and related warning, leading to crashing the application outside Telegram.', + ); + })(); +} \ No newline at end of file diff --git a/src/pages/IndexPage/IndexPage.jsx b/src/pages/IndexPage/IndexPage.jsx index a9d5754..88340da 100644 --- a/src/pages/IndexPage/IndexPage.jsx +++ b/src/pages/IndexPage/IndexPage.jsx @@ -9,7 +9,7 @@ import './IndexPage.css'; export function IndexPage() { return ( - +

This page is a home page in this boilerplate. You can use the links below to visit other pages with their own functionality. diff --git a/src/pages/InitDataPage/InitDataPage.jsx b/src/pages/InitDataPage/InitDataPage.jsx index c0f2c68..2ea7fbe 100644 --- a/src/pages/InitDataPage/InitDataPage.jsx +++ b/src/pages/InitDataPage/InitDataPage.jsx @@ -1,4 +1,4 @@ -import { retrieveLaunchParams, useInitData } from '@telegram-apps/sdk-solid'; +import { initData, useSignal } from '@telegram-apps/sdk-solid'; import { createMemo, Show } from 'solid-js'; import { DisplayData } from '@/components/DisplayData/DisplayData.jsx'; @@ -27,40 +27,53 @@ function getUserRows(user) { } export function InitDataPage() { - const initData = useInitData(); - const initDataRaw = retrieveLaunchParams().initDataRaw; + const initDataState = useSignal(initData.state); + const initDataRaw = useSignal(initData.raw); const initDataRows = createMemo(() => { - const complete = initData(); - - return complete && initDataRaw - ? [ - { title: 'raw', value: initDataRaw }, - { title: 'auth_date', value: complete.authDate.toLocaleString() }, - { title: 'auth_date (raw)', value: complete.authDate.getTime() / 1000 }, - { title: 'hash', value: complete.hash }, - { title: 'can_send_after', value: complete.canSendAfterDate?.toISOString() }, - { title: 'can_send_after (raw)', value: complete.canSendAfter }, - { title: 'query_id', value: complete.queryId }, - { title: 'start_param', value: complete.startParam }, - { title: 'chat_type', value: complete.chatType }, - { title: 'chat_instance', value: complete.chatInstance }, - ] - : undefined; + const state = initDataState(); + const raw = initDataRaw(); + if (!state || !raw) { + return; + } + const { + authDate, + hash, + queryId, + chatType, + chatInstance, + canSendAfter, + startParam, + } = state; + return [ + { title: 'raw', value: raw }, + { title: 'auth_date', value: authDate.toLocaleString() }, + { title: 'auth_date (raw)', value: authDate.getTime() / 1000 }, + { title: 'hash', value: hash }, + { + title: 'can_send_after', + value: initData.canSendAfterDate()?.toISOString(), + }, + { title: 'can_send_after (raw)', value: canSendAfter }, + { title: 'query_id', value: queryId }, + { title: 'start_param', value: startParam }, + { title: 'chat_type', value: chatType }, + { title: 'chat_instance', value: chatInstance }, + ]; }); const userRows = createMemo(() => { - const user = initData()?.user; + const user = initDataState()?.user; return user ? getUserRows(user) : undefined; }); const receiverRows = createMemo(() => { - const receiver = initData()?.receiver; + const receiver = initDataState()?.receiver; return receiver ? getUserRows(receiver) : undefined; }); const chatRows = createMemo(() => { - const chat = initData()?.chat; + const chat = initDataState()?.chat; return chat ? [ { title: 'id', value: chat.id.toString() }, @@ -74,6 +87,7 @@ export function InitDataPage() { return ( @@ -86,7 +100,10 @@ export function InitDataPage() { )} > - Application was launched with missing init data}> + Application was launched with missing init data} + > {(rows) => ( <>

@@ -96,21 +113,24 @@ export function InitDataPage() {

User

- User information missing}> + User information missing}> {(uRows) => }

Receiver

- Receiver information missing}> + Receiver information missing}> {(rRows) => }

Chat

- Chat information missing}> + Chat information missing}> {(cRows) => }
diff --git a/src/pages/LaunchParamsPage.jsx b/src/pages/LaunchParamsPage.jsx index c2827b1..789c376 100644 --- a/src/pages/LaunchParamsPage.jsx +++ b/src/pages/LaunchParamsPage.jsx @@ -9,6 +9,7 @@ export function LaunchParamsPage() { return ( @@ -27,7 +28,7 @@ export function LaunchParamsPage() { { title: 'tgWebAppShowSettings', value: lp.showSettings }, { title: 'tgWebAppVersion', value: lp.version }, { title: 'tgWebAppBotInline', value: lp.botInline }, - { title: 'tgWebAppStartParam', value: lp.showSettings }, + { title: 'tgWebAppStartParam', value: lp.startParam }, { title: 'tgWebAppData', value: View }, { title: 'tgWebAppThemeParams', value: View }, ]} diff --git a/src/pages/ThemeParamsPage.jsx b/src/pages/ThemeParamsPage.jsx index 403de7e..574448b 100644 --- a/src/pages/ThemeParamsPage.jsx +++ b/src/pages/ThemeParamsPage.jsx @@ -1,14 +1,15 @@ -import { useThemeParams } from '@telegram-apps/sdk-solid'; +import { useSignal, themeParams } from '@telegram-apps/sdk-solid'; import { DisplayData } from '@/components/DisplayData/DisplayData.jsx'; import { Link } from '@/components/Link/Link.jsx'; import { Page } from '@/components/Page/Page.jsx'; export function ThemeParamsPage() { - const themeParams = useThemeParams(); + const tpState = useSignal(themeParams.state); return ( @@ -24,7 +25,7 @@ export function ThemeParamsPage() { ({ title: title .replace(/[A-Z]/g, (m) => `_${m.toLowerCase()}`) diff --git a/src/pages/TonConnectPage/TonConnectPage.jsx b/src/pages/TonConnectPage/TonConnectPage.jsx index 4500fc9..e5ecfc8 100644 --- a/src/pages/TonConnectPage/TonConnectPage.jsx +++ b/src/pages/TonConnectPage/TonConnectPage.jsx @@ -12,7 +12,7 @@ export function TonConnectPage() { const wallet = useTonWallet(); return ( - +