mirror of
https://github.com/revoltchat/revite.git
synced 2024-11-09 16:53:36 -05:00
Add PWA update indicator.
This commit is contained in:
parent
e27f1bf9d6
commit
84da056f09
4 changed files with 33 additions and 5 deletions
25
src/components/common/UpdateIndicator.tsx
Normal file
25
src/components/common/UpdateIndicator.tsx
Normal file
|
@ -0,0 +1,25 @@
|
|||
import { updateSW } from "../../main";
|
||||
import IconButton from "../ui/IconButton";
|
||||
import { ThemeContext } from "../../context/Theme";
|
||||
import { Download } from "@styled-icons/boxicons-regular";
|
||||
import { internalSubscribe } from "../../lib/eventEmitter";
|
||||
import { useContext, useEffect, useState } from "preact/hooks";
|
||||
|
||||
var pendingUpdate = false;
|
||||
|
||||
export default function UpdateIndicator() {
|
||||
const [ pending, setPending ] = useState(pendingUpdate);
|
||||
|
||||
useEffect(() => {
|
||||
return internalSubscribe('PWA', 'update', () => setPending(true));
|
||||
});
|
||||
|
||||
if (!pending) return;
|
||||
const theme = useContext(ThemeContext);
|
||||
|
||||
return (
|
||||
<IconButton onClick={() => updateSW(true)}>
|
||||
<Download size={22} color={theme.success} />
|
||||
</IconButton>
|
||||
)
|
||||
}
|
|
@ -20,3 +20,4 @@ export function internalEmit(ns: string, event: string, ...args: any[]) {
|
|||
// - MessageBox/append
|
||||
// - TextArea/focus
|
||||
// - ReplyBar/add
|
||||
// - PWA/update
|
||||
|
|
10
src/main.tsx
10
src/main.tsx
|
@ -1,9 +1,9 @@
|
|||
import { registerSW } from 'virtual:pwa-register'
|
||||
const updateSW = registerSW({
|
||||
import { registerSW } from 'virtual:pwa-register';
|
||||
import { internalEmit } from './lib/eventEmitter';
|
||||
|
||||
export const updateSW = registerSW({
|
||||
onNeedRefresh() {
|
||||
// ! FIXME: temp
|
||||
updateSW(true);
|
||||
// show a prompt to user
|
||||
internalEmit('PWA', 'update');
|
||||
},
|
||||
onOfflineReady() {
|
||||
console.info('Ready to work offline.');
|
||||
|
|
|
@ -4,6 +4,7 @@ import { ChannelHeaderProps } from "../ChannelHeader";
|
|||
import IconButton from "../../../components/ui/IconButton";
|
||||
import { AppContext } from "../../../context/revoltjs/RevoltClient";
|
||||
import { isTouchscreenDevice } from "../../../lib/isTouchscreenDevice";
|
||||
import UpdateIndicator from "../../../components/common/UpdateIndicator";
|
||||
import { useIntermediate } from "../../../context/intermediate/Intermediate";
|
||||
import { VoiceContext, VoiceOperationsContext, VoiceStatus } from "../../../context/Voice";
|
||||
import { UserPlus, Cog, Sidebar as SidebarIcon, PhoneCall, PhoneOutgoing } from "@styled-icons/boxicons-regular";
|
||||
|
@ -15,6 +16,7 @@ export default function HeaderActions({ channel, toggleSidebar }: ChannelHeaderP
|
|||
|
||||
return (
|
||||
<>
|
||||
<UpdateIndicator />
|
||||
{ channel.channel_type === "Group" && (
|
||||
<>
|
||||
<IconButton onClick={() =>
|
||||
|
|
Loading…
Reference in a new issue