mirror of
https://github.com/blitzkit/blitzkit.git
synced 2026-10-21 18:57:03 +02:00
feat: patreon plug
This commit is contained in:
1 parent
0a0376312b
commit
14e45d97d2
11 files changed
+126
-61
No files matched your search
@@ -25,53 +25,52 @@ export default function Page({
|
||||
const router = useRouter();
|
||||
|
||||
useEffect(() => {
|
||||
(async () => {
|
||||
switch (params.provider) {
|
||||
case 'wargaming': {
|
||||
if (
|
||||
!searchParams.expires_at ||
|
||||
!searchParams.access_token ||
|
||||
!searchParams.account_id
|
||||
) {
|
||||
break;
|
||||
}
|
||||
|
||||
mutateApp((draft) => {
|
||||
draft.logins.wargaming = {
|
||||
id: Number(searchParams.account_id),
|
||||
token: searchParams.access_token,
|
||||
expires: Number(searchParams.expires_at) * 1000,
|
||||
};
|
||||
});
|
||||
|
||||
switch (params.provider) {
|
||||
case 'wargaming': {
|
||||
if (
|
||||
!searchParams.expires_at ||
|
||||
!searchParams.access_token ||
|
||||
!searchParams.account_id
|
||||
) {
|
||||
break;
|
||||
}
|
||||
|
||||
case 'patreon': {
|
||||
if (!searchParams.code) break;
|
||||
mutateApp((draft) => {
|
||||
draft.logins.wargaming = {
|
||||
id: Number(searchParams.account_id),
|
||||
token: searchParams.access_token,
|
||||
expires: Number(searchParams.expires_at) * 1000,
|
||||
};
|
||||
});
|
||||
|
||||
const data = (await fetch(
|
||||
`/api/patreon/auth/${searchParams.code}`,
|
||||
).then((response) => response.json())) as PatreonAuthResponse;
|
||||
|
||||
mutateApp((draft) => {
|
||||
draft.logins.patreon = {
|
||||
token: data.access_token,
|
||||
refreshToken: data.refresh_token,
|
||||
expires: Date.now() + data.expires_in * 1000,
|
||||
};
|
||||
});
|
||||
|
||||
break;
|
||||
}
|
||||
|
||||
default: {
|
||||
console.error(`Unknown provider: ${params.provider}`);
|
||||
}
|
||||
break;
|
||||
}
|
||||
|
||||
router.push(searchParams.return ?? '/');
|
||||
})();
|
||||
case 'patreon': {
|
||||
if (!searchParams.code) break;
|
||||
|
||||
// cannot await here because async breaks router.push :(
|
||||
fetch(`/api/patreon/auth/${searchParams.code}`)
|
||||
.then((response) => response.json() as Promise<PatreonAuthResponse>)
|
||||
.then((data) => {
|
||||
mutateApp((draft) => {
|
||||
draft.logins.patreon = {
|
||||
token: data.access_token,
|
||||
refreshToken: data.refresh_token,
|
||||
expires: Date.now() + data.expires_in * 1000,
|
||||
};
|
||||
});
|
||||
});
|
||||
|
||||
break;
|
||||
}
|
||||
|
||||
default: {
|
||||
console.error(`Unknown provider: ${params.provider}`);
|
||||
}
|
||||
}
|
||||
|
||||
router.push(searchParams.return ?? '/');
|
||||
});
|
||||
|
||||
return (
|
||||
|
||||
@@ -0,0 +1,44 @@
|
||||
'use client';
|
||||
|
||||
import { CheckIcon } from '@radix-ui/react-icons';
|
||||
import { Button, Flex, Link, Text } from '@radix-ui/themes';
|
||||
import { patreonLoginUrl } from '../../core/blitzkit/patreonLoginUrl';
|
||||
import { useAdExempt } from '../../hooks/useAdExempt';
|
||||
import { PatreonIcon } from '../../icons/Patreon';
|
||||
import { useApp } from '../../stores/app';
|
||||
|
||||
export function PatreonPlug() {
|
||||
const patreon = useApp((state) => state.logins.patreon);
|
||||
const exempt = useAdExempt();
|
||||
|
||||
if (exempt) return null;
|
||||
|
||||
return (
|
||||
<Flex
|
||||
gap="2"
|
||||
align="center"
|
||||
direction="column"
|
||||
justify="center"
|
||||
p="4"
|
||||
py="8"
|
||||
>
|
||||
<Flex gap="1" align="center">
|
||||
<Text size="4">Active Patreon supports go ad-free</Text>
|
||||
<CheckIcon width="1em" height="1em" />
|
||||
</Flex>
|
||||
|
||||
<Flex gap="2">
|
||||
<Link href="https://www.patreon.com/tresabhi" target="_blank">
|
||||
<Button>
|
||||
<PatreonIcon width={15} height={15} /> Support on Patreon
|
||||
</Button>
|
||||
</Link>
|
||||
{!patreon && (
|
||||
<Link href={patreonLoginUrl()}>
|
||||
<Button variant="outline">Log in with Patreon</Button>
|
||||
</Link>
|
||||
)}
|
||||
</Flex>
|
||||
</Flex>
|
||||
);
|
||||
}
|
||||
+3
-1
@@ -5,15 +5,17 @@ import PageWrapper from '../components/PageWrapper';
|
||||
import { TOOLS } from '../constants/tools';
|
||||
import { ImgurSize, imgur } from '../core/blitzkit/imgur';
|
||||
import { Hero } from './components/Hero';
|
||||
import { PatreonPlug } from './components/PatreonPlug';
|
||||
|
||||
export default function Page() {
|
||||
return (
|
||||
<>
|
||||
<Hero />
|
||||
|
||||
<PatreonPlug />
|
||||
|
||||
<PageWrapper size={1028}>
|
||||
<Grid
|
||||
p="4"
|
||||
gap="4"
|
||||
columns={{
|
||||
initial: undefined,
|
||||
|
||||
@@ -28,8 +28,9 @@ type AdProps = BoxProps & {
|
||||
export function Ad({ type, style, ...props }: AdProps) {
|
||||
const id = useRef(uniqueId());
|
||||
const dimensions = AD_DIMENSIONS[type];
|
||||
const exempt = useAdExempt();
|
||||
|
||||
useAdExempt();
|
||||
if (exempt) return null;
|
||||
|
||||
useEffect(() => {
|
||||
(window as any).msAdsQueue.push(function () {
|
||||
|
||||
@@ -27,7 +27,13 @@ export function Footer() {
|
||||
sm: 'row',
|
||||
}}
|
||||
>
|
||||
<Flex direction="column">
|
||||
<Flex
|
||||
direction="column"
|
||||
align={{
|
||||
initial: 'center',
|
||||
sm: 'start',
|
||||
}}
|
||||
>
|
||||
<Heading>
|
||||
BlitzKit{' '}
|
||||
<Text color="gray" size="1" weight="regular">
|
||||
|
||||
@@ -25,6 +25,7 @@ import { TOOLS } from '../../constants/tools';
|
||||
import { WARGAMING_APPLICATION_ID } from '../../constants/wargamingApplicationID';
|
||||
import { logoutPatreon } from '../../core/blitz/logoutPatreon';
|
||||
import { logoutWargaming } from '../../core/blitz/logoutWargaming';
|
||||
import { patreonLoginUrl } from '../../core/blitzkit/patreonLoginUrl';
|
||||
import { BlitzkitWide } from '../../icons/BlitzkitWide';
|
||||
import { PatreonIcon } from '../../icons/Patreon';
|
||||
import { WargamingIcon } from '../../icons/Wargaming';
|
||||
@@ -192,10 +193,7 @@ export default function Navbar() {
|
||||
</Text>
|
||||
|
||||
{!logins.patreon && (
|
||||
<Link
|
||||
style={{ width: '100%' }}
|
||||
href={`https://www.patreon.com/oauth2/authorize?response_type=code&client_id=${process.env.NEXT_PUBLIC_PATREON_CLIENT_ID}&redirect_uri=${process.env.NEXT_PUBLIC_PATREON_REDIRECT_URI}&scope=identity`}
|
||||
>
|
||||
<Link style={{ width: '100%' }} href={patreonLoginUrl()}>
|
||||
<Button style={{ width: '100%' }} color="tomato">
|
||||
<PatreonIcon width={15} height={15} /> Patreon
|
||||
</Button>
|
||||
@@ -216,10 +214,10 @@ export default function Navbar() {
|
||||
|
||||
<Flex gap="2" wrap="wrap">
|
||||
{REGIONS.map((region) => (
|
||||
<Dialog.Close>
|
||||
<Dialog.Close key={region}>
|
||||
<Link
|
||||
href={
|
||||
typeof window?.location === undefined
|
||||
typeof window === undefined
|
||||
? undefined
|
||||
: `https://api.worldoftanks.${region}/wot/auth/login/?application_id=${WARGAMING_APPLICATION_ID}&redirect_uri=${encodeURIComponent(
|
||||
`${location.origin}/auth/wargaming?return=${location.origin}${location.pathname}`,
|
||||
|
||||
@@ -0,0 +1,10 @@
|
||||
export function patreonLoginUrl() {
|
||||
const params = new URLSearchParams({
|
||||
response_type: 'code',
|
||||
client_id: process.env.NEXT_PUBLIC_PATREON_CLIENT_ID as string,
|
||||
redirect_uri: process.env.NEXT_PUBLIC_PATREON_REDIRECT_URI as string,
|
||||
scope: 'identity',
|
||||
});
|
||||
|
||||
return `https://www.patreon.com/oauth2/authorize?${params}`;
|
||||
}
|
||||
@@ -1,3 +1,4 @@
|
||||
import { use } from 'react';
|
||||
import { useApp } from '../stores/app';
|
||||
|
||||
export function useAdExempt() {
|
||||
@@ -5,7 +6,11 @@ export function useAdExempt() {
|
||||
|
||||
if (!patreon) return false;
|
||||
|
||||
fetch(`/api/patreon/membership/${patreon.token}`)
|
||||
.then((response) => response.json())
|
||||
.then(console.log);
|
||||
const json = use(
|
||||
fetch(`/api/patreon/membership/${patreon.token}`, {
|
||||
cache: 'force-cache',
|
||||
}).then((response) => response.json()),
|
||||
);
|
||||
|
||||
return typeof json === 'boolean' && json;
|
||||
}
|
||||
@@ -36,8 +36,8 @@ export function Blitzkit(props: ComponentProps<'svg'>) {
|
||||
fill="url(#paint4_linear_513_245)"
|
||||
/>
|
||||
<path
|
||||
fill-rule="evenodd"
|
||||
clip-rule="evenodd"
|
||||
fillRule="evenodd"
|
||||
clipRule="evenodd"
|
||||
d="M213.905 307L91 219.714L137.393 186.767C150.906 177.17 164.124 171.539 177.048 169.875C189.971 168.211 201.919 171.275 212.893 179.069C219.702 183.905 223.718 189.006 224.941 194.372C226.165 199.658 225.302 204.506 222.354 208.918L222.692 209.158C229.978 206.301 237.935 205.286 246.563 206.113C255.247 206.9 263.613 210.151 271.66 215.866C282.803 223.779 287.398 232.825 285.446 243.004C283.551 253.142 275.96 262.929 262.672 272.366L213.905 307ZM242.999 260.08L221.456 275.38L184.905 249.422L206.448 234.123C213.007 229.465 219.473 227.23 225.846 227.42C232.22 227.529 238.193 229.562 243.764 233.519C249.392 237.516 252.31 241.797 252.521 246.364C252.732 250.85 249.558 255.422 242.999 260.08ZM186.937 223.64L167.77 237.252L135.693 214.472L154.861 200.859C161.363 196.241 167.435 193.887 173.076 193.798C178.717 193.708 184.07 195.462 189.135 199.059C194.256 202.696 196.809 206.557 196.796 210.643C196.726 214.69 193.44 219.022 186.937 223.64Z"
|
||||
fill="url(#paint5_linear_513_245)"
|
||||
/>
|
||||
|
||||
@@ -10,7 +10,7 @@ export function BlitzkitButtonWatermark(props: ComponentProps<'svg'>) {
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
{...props}
|
||||
>
|
||||
<g opacity="0.1" clip-path="url(#clip0_513_262)">
|
||||
<g opacity="0.1" clipPath="url(#clip0_513_262)">
|
||||
<path
|
||||
d="M416.628 244.997L235.625 372.974C223.13 381.809 202.87 381.809 190.375 372.974L9.37173 244.997C3.1239 240.58 -3.95076e-06 234.79 0 229V196.6L213 54.5L426 196.6V229C426 234.79 422.876 240.58 416.628 244.997Z"
|
||||
fill="#8D8D8D"
|
||||
@@ -28,8 +28,8 @@ export function BlitzkitButtonWatermark(props: ComponentProps<'svg'>) {
|
||||
fill="white"
|
||||
/>
|
||||
<path
|
||||
fill-rule="evenodd"
|
||||
clip-rule="evenodd"
|
||||
fillRule="evenodd"
|
||||
clipRule="evenodd"
|
||||
d="M416.628 180.603L235.625 52.6262C223.13 43.7913 202.87 43.7913 190.375 52.6262L9.37172 180.603C-3.12391 189.438 -3.12391 203.762 9.37173 212.597L190.375 340.574C202.87 349.409 223.13 349.409 235.625 340.574L416.628 212.597C429.124 203.762 429.124 189.438 416.628 180.603ZM218.47 76.4488L232.267 101.781L239 96.9786L224.094 71.0312L219.844 68L198.721 83.0665L203.957 86.8006L218.47 76.4488ZM184.681 106.963C181.602 104.766 180.042 102.326 180 99.6413C179.973 96.947 181.629 94.409 184.968 92.0273C188.143 89.7627 191.804 88.6061 195.95 88.5574C200.097 88.5088 204.484 90.1343 209.11 93.4339L209.91 94.005C214.92 97.578 217.431 101.507 217.445 105.793C217.459 110.059 214.606 114.3 208.886 118.517L208.208 119L203.24 115.456L203.856 115.017C207.537 112.391 209.494 109.697 209.727 106.934C209.886 104.918 208.879 102.845 206.707 100.715C206.753 100.859 206.794 101.004 206.832 101.151C207.434 103.493 206.38 105.631 203.671 107.564C200.852 109.575 197.731 110.512 194.31 110.375C190.888 110.238 187.679 109.101 184.681 106.963ZM311.596 231.945L218.056 168.108L238.292 153.762L286.867 185.722L284.968 151.871L307.355 136L309.049 176.111L380.102 183.378L356.236 200.298L309.86 195.31L310.153 202.23L331.832 217.599L311.596 231.945ZM91 219.714L213.905 307L262.672 272.366C275.96 262.929 283.551 253.142 285.446 243.003C287.398 232.825 282.803 223.779 271.66 215.866C263.613 210.151 255.247 206.9 246.563 206.113C237.935 205.286 229.978 206.301 222.692 209.158L222.354 208.918C225.302 204.506 226.165 199.658 224.941 194.372C223.718 189.006 219.702 183.905 212.893 179.069C201.919 171.275 189.971 168.211 177.048 169.875C164.124 171.539 150.906 177.17 137.393 186.767L91 219.714Z"
|
||||
fill="white"
|
||||
/>
|
||||
|
||||
@@ -10,10 +10,10 @@ export function WargamingIcon(props: ComponentProps<'svg'>) {
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
{...props}
|
||||
>
|
||||
<g clip-path="url(#clip0_574_231)">
|
||||
<g clipPath="url(#clip0_574_231)">
|
||||
<path
|
||||
fill-rule="evenodd"
|
||||
clip-rule="evenodd"
|
||||
fillRule="evenodd"
|
||||
clipRule="evenodd"
|
||||
d="M7.46409 0.156338C8.91652 0.149247 10.3384 0.57301 11.55 1.37404C12.7616 2.17507 13.7085 3.31739 14.2709 4.65654C14.8332 5.9957 14.9859 7.47154 14.7095 8.89745C14.4331 10.3234 13.7401 11.6353 12.7181 12.6673C11.6961 13.6994 10.391 14.4052 8.96789 14.6955C7.54475 14.9859 6.06748 14.8477 4.72288 14.2984C3.37829 13.7492 2.22676 12.8136 1.41391 11.6099C0.601062 10.4062 0.163403 8.98846 0.156278 7.53603V7.50009C0.150882 5.5586 0.916644 3.69442 2.28523 2.31733C3.65382 0.940243 5.51323 0.162958 7.45472 0.156338H7.46409ZM7.46409 1.56259C8.76962 1.56799 10.0372 2.00218 11.0719 2.79837C12.1065 3.59456 12.8509 4.70863 13.1906 5.96922C13.5302 7.2298 13.4463 8.56706 12.9517 9.77529C12.4571 10.9835 11.5792 11.9958 10.4532 12.6563C10.8305 11.3103 10.9857 9.91172 10.9125 8.51571C11.2938 8.62353 11.5094 8.68446 11.8922 8.8079C11.47 7.70829 10.9518 6.64795 10.3438 5.63915C9.79373 6.67527 9.10279 7.63018 8.29065 8.47665L9.51565 8.40009C8.46097 10.2938 6.97347 11.2126 5.08909 11.4798C4.6594 9.33759 4.98128 5.85478 7.38597 4.21728L7.62972 5.38603C8.09847 4.63134 9.02503 3.6329 9.71409 2.93759C8.57965 2.49502 7.34402 2.37866 6.1469 2.60165C6.34534 2.77196 6.59065 2.98759 6.78909 3.15634C4.07815 4.3079 2.58909 6.20009 1.6094 8.40009C1.48639 7.55586 1.54531 6.69509 1.78221 5.87549C2.0191 5.0559 2.4285 4.29643 2.98295 3.64802C3.5374 2.99961 4.22409 2.47724 4.99695 2.11595C5.76982 1.75465 6.611 1.56279 7.46409 1.55321V1.56259Z"
|
||||
fill="currentColor"
|
||||
/>
|
||||
|
||||
Reference in new issue
Block a user