Franknoirot/refresh button add (#2314)
* Add a simple refresh button * Add plausible event for when Refresh button is clicked
This commit is contained in:
37
src/components/RefreshButton.tsx
Normal file
37
src/components/RefreshButton.tsx
Normal file
@ -0,0 +1,37 @@
|
||||
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>
|
||||
)
|
||||
}
|
Reference in New Issue
Block a user