1
0
Fork 0
forked from mirrors/ntfy

Move things around a bit

This commit is contained in:
Philipp Heckel 2022-03-08 11:33:17 -05:00
parent 30b13cbdbc
commit 4aad98256a
5 changed files with 26 additions and 28 deletions

View file

@ -1,7 +1,7 @@
import api from "./Api";
import subscriptionManager from "./SubscriptionManager";
const delayMillis = 3000; // 3 seconds
const delayMillis = 8000; // 8 seconds
const intervalMillis = 300000; // 5 minutes
class Poller {
@ -13,6 +13,7 @@ class Poller {
if (this.timer !== null) {
return;
}
console.log(`[Poller] Starting worker`);
this.timer = setInterval(() => this.pollAll(), intervalMillis);
setTimeout(() => this.pollAll(), delayMillis);
}
@ -55,4 +56,6 @@ class Poller {
}
const poller = new Poller();
poller.startWorker();
export default poller;

View file

@ -13,6 +13,7 @@ class Pruner {
if (this.timer !== null) {
return;
}
console.log(`[Pruner] Starting worker`);
this.timer = setInterval(() => this.prune(), intervalMillis);
setTimeout(() => this.prune(), delayMillis);
}
@ -34,4 +35,6 @@ class Pruner {
}
const pruner = new Pruner();
pruner.startWorker();
export default pruner;

View file

@ -47,7 +47,6 @@ const Root = () => {
const selectedSubscription = findSelected(location, subscriptions);
const newNotificationsCount = subscriptions?.reduce((prev, cur) => prev + cur.new, 0) || 0;
useWorkers();
useConnectionListeners();
useEffect(() => {
@ -66,16 +65,14 @@ const Root = () => {
selectedSubscription={selectedSubscription}
onMobileDrawerToggle={() => setMobileDrawerOpen(!mobileDrawerOpen)}
/>
<Box component="nav" sx={{width: {sm: Navigation.width}, flexShrink: {sm: 0}}}>
<Navigation
subscriptions={subscriptions}
selectedSubscription={selectedSubscription}
notificationsGranted={notificationsGranted}
requestNotificationPermission={() => notifier.maybeRequestPermission(granted => setNotificationsGranted(granted))}
mobileDrawerOpen={mobileDrawerOpen}
onMobileDrawerToggle={() => setMobileDrawerOpen(!mobileDrawerOpen)}
/>
</Box>
<Navigation
subscriptions={subscriptions}
selectedSubscription={selectedSubscription}
notificationsGranted={notificationsGranted}
mobileDrawerOpen={mobileDrawerOpen}
onMobileDrawerToggle={() => setMobileDrawerOpen(!mobileDrawerOpen)}
onNotificationGranted={setNotificationsGranted}
/>
<Main>
<Toolbar/>
<Routes>
@ -136,14 +133,6 @@ const findSelected = (location, subscriptions) => {
*/
};
const useWorkers = () => {
useEffect(() => {
poller.startWorker();
pruner.startWorker();
}, []);
};
const useConnectionListeners = () => {
const navigate = useNavigate();
useEffect(() => {

View file

@ -19,13 +19,15 @@ import {ConnectionState} from "../app/Connection";
import {useLocation, useNavigate} from "react-router-dom";
import subscriptionManager from "../app/SubscriptionManager";
import {ChatBubble} from "@mui/icons-material";
import Box from "@mui/material/Box";
import notifier from "../app/Notifier";
const navWidth = 240;
const Navigation = (props) => {
const navigationList = <NavList {...props}/>;
return (
<>
<Box component="nav" sx={{width: {sm: Navigation.width}, flexShrink: {sm: 0}}}>
{/* Mobile drawer; only shown if menu icon clicked (mobile open) and display is small */}
<Drawer
variant="temporary"
@ -50,7 +52,7 @@ const Navigation = (props) => {
>
{navigationList}
</Drawer>
</>
</Box>
);
};
Navigation.width = navWidth;
@ -70,9 +72,13 @@ const NavList = (props) => {
console.log(`[Navigation] New subscription: ${subscription.id}`, subscription);
handleSubscribeReset();
navigate(subscriptionRoute(subscription));
props.requestNotificationPermission();
handleRequestNotificationPermission();
}
const handleRequestNotificationPermission = () => {
notifier.maybeRequestPermission(granted => props.onNotificationGranted(granted))
};
const showSubscriptionsList = props.subscriptions?.length > 0;
const showGrantPermissionsBox = props.subscriptions?.length > 0 && !props.notificationsGranted;
@ -80,7 +86,7 @@ const NavList = (props) => {
<>
<Toolbar sx={{ display: { xs: 'none', sm: 'block' } }}/>
<List component="nav" sx={{ paddingTop: (showGrantPermissionsBox) ? '0' : '' }}>
{showGrantPermissionsBox && <PermissionAlert onRequestPermissionClick={props.requestNotificationPermission}/>}
{showGrantPermissionsBox && <PermissionAlert onRequestPermissionClick={handleRequestNotificationPermission}/>}
{!showSubscriptionsList &&
<ListItemButton onClick={() => navigate("/")} selected={location.pathname === "/"}>
<ListItemIcon><ChatBubble/></ListItemIcon>

View file

@ -54,8 +54,8 @@ const NotificationList = (props) => {
const pageSize = 20;
const notifications = props.notifications;
const [maxCount, setMaxCount] = useState(pageSize);
const count = Math.min(notifications.length, maxCount);
// Reset state when the list identifier changes, i.e when we switch between subscriptions
useEffect(() => {
return () => {
setMaxCount(pageSize);
@ -63,9 +63,6 @@ const NotificationList = (props) => {
}
}, [props.id]);
const count = Math.min(notifications.length, maxCount);
console.log(`xxx id=${props.id} scrollMax=${maxCount} count=${count} len=${notifications.length}`)
return (
<InfiniteScroll
dataLength={count}