Add refresh buttons to these pages
This commit is contained in:
17
src/app/components/ReloadButton.tsx
Normal file
17
src/app/components/ReloadButton.tsx
Normal file
@@ -0,0 +1,17 @@
|
|||||||
|
import { faArrowsRotate } from '@fortawesome/free-solid-svg-icons'
|
||||||
|
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
|
||||||
|
|
||||||
|
export function ReloadButton ({ action }: { action: () => void }) {
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
<div className='relative'>
|
||||||
|
<button
|
||||||
|
className='top-button absolute -top-4 -right-4'
|
||||||
|
onClick={action}
|
||||||
|
>
|
||||||
|
<FontAwesomeIcon icon={faArrowsRotate} />
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</>
|
||||||
|
)
|
||||||
|
}
|
||||||
@@ -1,7 +1,7 @@
|
|||||||
'use client'
|
'use client'
|
||||||
|
|
||||||
import { BackButton } from '@/app/components/BackButton'
|
import { BackButton } from '@/app/components/BackButton'
|
||||||
import { DiscordButton } from '@/app/components/DiscordButton'
|
import { ReloadButton } from '@/app/components/ReloadButton'
|
||||||
import axios from 'axios'
|
import axios from 'axios'
|
||||||
import Link from 'next/link'
|
import Link from 'next/link'
|
||||||
import { useEffect, useState } from 'react'
|
import { useEffect, useState } from 'react'
|
||||||
@@ -9,22 +9,29 @@ import { useEffect, useState } from 'react'
|
|||||||
export default function BerryDashSplash () {
|
export default function BerryDashSplash () {
|
||||||
const [response, setResponse] = useState<string | null | -1>(null)
|
const [response, setResponse] = useState<string | null | -1>(null)
|
||||||
|
|
||||||
useEffect(() => {
|
async function Refresh () {
|
||||||
document.title = 'Lncvrt Games - Berry Dash Splash Texts'
|
|
||||||
;(async () => {
|
|
||||||
try {
|
try {
|
||||||
const request = await axios.get('/api/berrydash/splash-text')
|
const request = await axios.get('/api/berrydash/splash-text')
|
||||||
setResponse(request.data)
|
setResponse(request.data)
|
||||||
} catch {
|
} catch {
|
||||||
setResponse(-1)
|
setResponse(-1)
|
||||||
}
|
}
|
||||||
})()
|
}
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
document.title = 'Lncvrt Games - Berry Dash Splash Texts'
|
||||||
|
Refresh()
|
||||||
}, [])
|
}, [])
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className='box'>
|
<div className='box'>
|
||||||
<BackButton href='/game/berry-dash' />
|
<BackButton href='/game/berry-dash' />
|
||||||
<DiscordButton />
|
<ReloadButton
|
||||||
|
action={() => {
|
||||||
|
setResponse(null)
|
||||||
|
Refresh()
|
||||||
|
}}
|
||||||
|
/>
|
||||||
<p className='px-8 mb-2 -mt-2 text-center text-2xl'>
|
<p className='px-8 mb-2 -mt-2 text-center text-2xl'>
|
||||||
Berry Dash Splash Texts
|
Berry Dash Splash Texts
|
||||||
</p>
|
</p>
|
||||||
|
|||||||
@@ -1,7 +1,7 @@
|
|||||||
'use client'
|
'use client'
|
||||||
|
|
||||||
import { BackButton } from '@/app/components/BackButton'
|
import { BackButton } from '@/app/components/BackButton'
|
||||||
import { DiscordButton } from '@/app/components/DiscordButton'
|
import { ReloadButton } from '@/app/components/ReloadButton'
|
||||||
import { getCookie } from '@/util/cookie'
|
import { getCookie } from '@/util/cookie'
|
||||||
import { Turnstile } from '@marsidev/react-turnstile'
|
import { Turnstile } from '@marsidev/react-turnstile'
|
||||||
import axios from 'axios'
|
import axios from 'axios'
|
||||||
@@ -26,7 +26,7 @@ export default function BerryDashSubmitSplash () {
|
|||||||
return (
|
return (
|
||||||
<div className='box'>
|
<div className='box'>
|
||||||
<BackButton href='/game/berry-dash/splash' />
|
<BackButton href='/game/berry-dash/splash' />
|
||||||
<DiscordButton />
|
<ReloadButton action={() => window.location.reload()} />
|
||||||
<p className={`px-8 ${loading ? '-my-2' : 'mb-4 -mt-2'} text-center`}>
|
<p className={`px-8 ${loading ? '-my-2' : 'mb-4 -mt-2'} text-center`}>
|
||||||
{loading
|
{loading
|
||||||
? 'Loading...'
|
? 'Loading...'
|
||||||
|
|||||||
Reference in New Issue
Block a user