38 lines
1.1 KiB
TypeScript
38 lines
1.1 KiB
TypeScript
import { CustomIcon } from './CustomIcon'
|
|
import Tooltip from './Tooltip'
|
|
|
|
export function RefreshButton() {
|
|
async function refresh() {
|
|
if (window && 'plausible' in window) {
|
|
const p = window.plausible as (
|
|
event: string,
|
|
options?: { props: Record<string, string> }
|
|
) => Promise<void>
|
|
// Send a refresh event to Plausible so we can track how often users get stuck
|
|
await p('Refresh', {
|
|
props: {
|
|
method: 'UI button',
|
|
// TODO: add more coredump data here
|
|
},
|
|
})
|
|
}
|
|
|
|
// Window may not be available in some environments
|
|
window?.location.reload()
|
|
}
|
|
|
|
return (
|
|
<button
|
|
onClick={refresh}
|
|
className="p-1 m-0 bg-chalkboard-10/80 dark:bg-chalkboard-100/50 hover:bg-chalkboard-10 dark:hover:bg-chalkboard-100 rounded-full border border-solid border-chalkboard-10 dark:border-chalkboard-100"
|
|
>
|
|
<CustomIcon name="arrowRotateRight" className="w-5 h-5" />
|
|
<Tooltip position="bottom-right">
|
|
<span>Refresh and report</span>
|
|
<br />
|
|
<span className="text-xs">Send us data on how you got stuck</span>
|
|
</Tooltip>
|
|
</button>
|
|
)
|
|
}
|