astra/ntfy
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

"No topics" and "No notifications" view

Browse source
This commit is contained in:
Philipp Heckel 2022-02-28 11:52:50 -05:00
parent 0909354a6c
commit 17e5af654b
9 changed files with 494 additions and 11 deletions
Download patch file Download diff file Expand all files Collapse all files

23
web/src/components/App.js
View file

@ -4,7 +4,7 @@ import Box from '@mui/material/Box';
import {ThemeProvider} from '@mui/material/styles';
import CssBaseline from '@mui/material/CssBaseline';
import Toolbar from '@mui/material/Toolbar';
import NotificationList from "./NotificationList";
import Notifications from "./Notifications";
import theme from "./theme";
import api from "../app/Api";
import repository from "../app/Repository";
@ -14,14 +14,13 @@ import Navigation from "./Navigation";
import ActionBar from "./ActionBar";
import Users from "../app/Users";
import notificationManager from "../app/NotificationManager";
import NoTopics from "./NoTopics";
// FIXME chrome notification order
// TODO subscribe dialog:
// - check/use existing user
// - add baseUrl
// TODO user management
// TODO embed into ntfy server
// TODO remember selected subscription
const App = () => {
console.log(`[App] Rendering main view`);
@ -84,10 +83,17 @@ const App = () => {
useEffect(() => {
// Load subscriptions and users
const subscriptions = repository.loadSubscriptions();
const selectedSubscriptionId = repository.loadSelectedSubscriptionId();
const users = repository.loadUsers();
setSubscriptions(subscriptions);
setUsers(users);
// Set selected subscription
const maybeSelectedSubscription = subscriptions.get(selectedSubscriptionId);
if (maybeSelectedSubscription) {
setSelectedSubscription(maybeSelectedSubscription);
}
// Poll all subscriptions
subscriptions.forEach((subscriptionId, subscription) => {
const user = users.get(subscription.baseUrl); // May be null
@ -109,6 +115,10 @@ const App = () => {
}, [subscriptions, users]);
useEffect(() => repository.saveSubscriptions(subscriptions), [subscriptions]);
useEffect(() => repository.saveUsers(users), [users]);
useEffect(() => {
const subscriptionId = (selectedSubscription) ? selectedSubscription.id : "";
repository.saveSelectedSubscriptionId(subscriptionId)
}, [selectedSubscription]);
return (
<ThemeProvider theme={theme}>
@ -137,8 +147,10 @@ const App = () => {
<Box
component="main"
sx={{
display: 'flex',
flexGrow: 1,
p: 3,
flexDirection: 'column',
padding: 3,
width: {sm: `calc(100% - ${Navigation.width}px)`},
height: '100vh',
overflow: 'auto',
@ -146,10 +158,11 @@ const App = () => {
}}>
<Toolbar/>
{selectedSubscription !== null &&
<NotificationList
<Notifications
subscription={selectedSubscription}
onDeleteNotification={handleDeleteNotification}
/>}
{selectedSubscription == null && <NoTopics />}
</Box>
</Box>
</ThemeProvider>