mirror of
https://github.com/binwiederhier/ntfy.git
synced 2024-12-24 09:22:40 +03:00
Refactor to responsive drawer
This commit is contained in:
parent
0958c1d527
commit
703f94a25f
58
web/package-lock.json
generated
58
web/package-lock.json
generated
@ -13,6 +13,7 @@
|
||||
"@mui/material": "latest",
|
||||
"react": "latest",
|
||||
"react-dom": "latest",
|
||||
"react-router-dom": "^6.2.1",
|
||||
"react-scripts": "^3.0.1"
|
||||
}
|
||||
},
|
||||
@ -8313,6 +8314,14 @@
|
||||
"resolved": "https://registry.npmjs.org/hex-color-regex/-/hex-color-regex-1.1.0.tgz",
|
||||
"integrity": "sha512-l9sfDFsuqtOqKDsQdqrMRk0U85RZc0RtOR9yPI7mRVOa4FsR/BVnZ0shmQRM96Ji99kYZP/7hn1cedc1+ApsTQ=="
|
||||
},
|
||||
"node_modules/history": {
|
||||
"version": "5.3.0",
|
||||
"resolved": "https://registry.npmjs.org/history/-/history-5.3.0.tgz",
|
||||
"integrity": "sha512-ZqaKwjjrAYUYfLG+htGaIIZ4nioX2L70ZUMIFysS3xvBsSG4x/n1V6TXV3N8ZYNuFGlDirFg32T7B6WOUPDYcQ==",
|
||||
"dependencies": {
|
||||
"@babel/runtime": "^7.7.6"
|
||||
}
|
||||
},
|
||||
"node_modules/hmac-drbg": {
|
||||
"version": "1.0.1",
|
||||
"resolved": "https://registry.npmjs.org/hmac-drbg/-/hmac-drbg-1.0.1.tgz",
|
||||
@ -13673,6 +13682,30 @@
|
||||
"resolved": "https://registry.npmjs.org/react-is/-/react-is-17.0.2.tgz",
|
||||
"integrity": "sha512-w2GsyukL62IJnlaff/nRegPQR94C/XXamvMWmSHRJ4y7Ts/4ocGRmTHvOs8PSE6pB3dWOrD/nueuU5sduBsQ4w=="
|
||||
},
|
||||
"node_modules/react-router": {
|
||||
"version": "6.2.1",
|
||||
"resolved": "https://registry.npmjs.org/react-router/-/react-router-6.2.1.tgz",
|
||||
"integrity": "sha512-2fG0udBtxou9lXtK97eJeET2ki5//UWfQSl1rlJ7quwe6jrktK9FCCc8dQb5QY6jAv3jua8bBQRhhDOM/kVRsg==",
|
||||
"dependencies": {
|
||||
"history": "^5.2.0"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"react": ">=16.8"
|
||||
}
|
||||
},
|
||||
"node_modules/react-router-dom": {
|
||||
"version": "6.2.1",
|
||||
"resolved": "https://registry.npmjs.org/react-router-dom/-/react-router-dom-6.2.1.tgz",
|
||||
"integrity": "sha512-I6Zax+/TH/cZMDpj3/4Fl2eaNdcvoxxHoH1tYOREsQ22OKDYofGebrNm6CTPUcvLvZm63NL/vzCYdjf9CUhqmA==",
|
||||
"dependencies": {
|
||||
"history": "^5.2.0",
|
||||
"react-router": "6.2.1"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"react": ">=16.8",
|
||||
"react-dom": ">=16.8"
|
||||
}
|
||||
},
|
||||
"node_modules/react-scripts": {
|
||||
"version": "3.4.4",
|
||||
"resolved": "https://registry.npmjs.org/react-scripts/-/react-scripts-3.4.4.tgz",
|
||||
@ -24030,6 +24063,14 @@
|
||||
"resolved": "https://registry.npmjs.org/hex-color-regex/-/hex-color-regex-1.1.0.tgz",
|
||||
"integrity": "sha512-l9sfDFsuqtOqKDsQdqrMRk0U85RZc0RtOR9yPI7mRVOa4FsR/BVnZ0shmQRM96Ji99kYZP/7hn1cedc1+ApsTQ=="
|
||||
},
|
||||
"history": {
|
||||
"version": "5.3.0",
|
||||
"resolved": "https://registry.npmjs.org/history/-/history-5.3.0.tgz",
|
||||
"integrity": "sha512-ZqaKwjjrAYUYfLG+htGaIIZ4nioX2L70ZUMIFysS3xvBsSG4x/n1V6TXV3N8ZYNuFGlDirFg32T7B6WOUPDYcQ==",
|
||||
"requires": {
|
||||
"@babel/runtime": "^7.7.6"
|
||||
}
|
||||
},
|
||||
"hmac-drbg": {
|
||||
"version": "1.0.1",
|
||||
"resolved": "https://registry.npmjs.org/hmac-drbg/-/hmac-drbg-1.0.1.tgz",
|
||||
@ -28290,6 +28331,23 @@
|
||||
"resolved": "https://registry.npmjs.org/react-is/-/react-is-17.0.2.tgz",
|
||||
"integrity": "sha512-w2GsyukL62IJnlaff/nRegPQR94C/XXamvMWmSHRJ4y7Ts/4ocGRmTHvOs8PSE6pB3dWOrD/nueuU5sduBsQ4w=="
|
||||
},
|
||||
"react-router": {
|
||||
"version": "6.2.1",
|
||||
"resolved": "https://registry.npmjs.org/react-router/-/react-router-6.2.1.tgz",
|
||||
"integrity": "sha512-2fG0udBtxou9lXtK97eJeET2ki5//UWfQSl1rlJ7quwe6jrktK9FCCc8dQb5QY6jAv3jua8bBQRhhDOM/kVRsg==",
|
||||
"requires": {
|
||||
"history": "^5.2.0"
|
||||
}
|
||||
},
|
||||
"react-router-dom": {
|
||||
"version": "6.2.1",
|
||||
"resolved": "https://registry.npmjs.org/react-router-dom/-/react-router-dom-6.2.1.tgz",
|
||||
"integrity": "sha512-I6Zax+/TH/cZMDpj3/4Fl2eaNdcvoxxHoH1tYOREsQ22OKDYofGebrNm6CTPUcvLvZm63NL/vzCYdjf9CUhqmA==",
|
||||
"requires": {
|
||||
"history": "^5.2.0",
|
||||
"react-router": "6.2.1"
|
||||
}
|
||||
},
|
||||
"react-scripts": {
|
||||
"version": "3.4.4",
|
||||
"resolved": "https://registry.npmjs.org/react-scripts/-/react-scripts-3.4.4.tgz",
|
||||
|
@ -9,12 +9,13 @@
|
||||
"eject": "react-scripts eject"
|
||||
},
|
||||
"dependencies": {
|
||||
"react": "latest",
|
||||
"react-dom": "latest",
|
||||
"react-scripts": "^3.0.1",
|
||||
"@emotion/styled": "latest",
|
||||
"@mui/icons-material": "^5.4.2",
|
||||
"@mui/material": "latest",
|
||||
"@emotion/styled": "latest"
|
||||
"react": "latest",
|
||||
"react-dom": "latest",
|
||||
"react-router-dom": "^6.2.1",
|
||||
"react-scripts": "^3.0.1"
|
||||
},
|
||||
"browserslist": {
|
||||
"production": [
|
||||
|
@ -60,7 +60,6 @@ export async function* fetchLinesIterator(fileURL) {
|
||||
|
||||
const re = /\n|\r|\r\n/gm;
|
||||
let startIndex = 0;
|
||||
let result;
|
||||
|
||||
for (;;) {
|
||||
let result = re.exec(chunk);
|
||||
|
@ -2,25 +2,24 @@ import * as React from 'react';
|
||||
import {useEffect, useState} from 'react';
|
||||
import Typography from '@mui/material/Typography';
|
||||
import Box from '@mui/material/Box';
|
||||
import {styled, ThemeProvider} from '@mui/material/styles';
|
||||
import {ThemeProvider} from '@mui/material/styles';
|
||||
import CssBaseline from '@mui/material/CssBaseline';
|
||||
import MuiDrawer from '@mui/material/Drawer';
|
||||
import MuiAppBar from '@mui/material/AppBar';
|
||||
import Drawer from '@mui/material/Drawer';
|
||||
import AppBar from '@mui/material/AppBar';
|
||||
import Toolbar from '@mui/material/Toolbar';
|
||||
import ChatBubbleOutlineIcon from '@mui/icons-material/ChatBubbleOutline';
|
||||
import List from '@mui/material/List';
|
||||
import Divider from '@mui/material/Divider';
|
||||
import IconButton from '@mui/material/IconButton';
|
||||
import MenuIcon from '@mui/icons-material/Menu';
|
||||
import ChevronLeftIcon from '@mui/icons-material/ChevronLeft';
|
||||
import ListItemIcon from "@mui/material/ListItemIcon";
|
||||
import ListItemText from "@mui/material/ListItemText";
|
||||
import ListItemButton from "@mui/material/ListItemButton";
|
||||
import SettingsIcon from "@mui/icons-material/Settings";
|
||||
import AddIcon from "@mui/icons-material/Add";
|
||||
import AddDialog from "./AddDialog";
|
||||
import SubscribeDialog from "./SubscribeDialog";
|
||||
import NotificationList from "./NotificationList";
|
||||
import SubscriptionSettings from "./SubscriptionSettings";
|
||||
import IconSubscribeSettings from "./IconSubscribeSettings";
|
||||
import theme from "./theme";
|
||||
import api from "../app/Api";
|
||||
import repository from "../app/Repository";
|
||||
@ -29,68 +28,23 @@ import Subscriptions from "../app/Subscriptions";
|
||||
|
||||
const drawerWidth = 240;
|
||||
|
||||
const AppBar = styled(MuiAppBar, {
|
||||
shouldForwardProp: (prop) => prop !== 'open',
|
||||
})(({ theme, open }) => ({
|
||||
zIndex: theme.zIndex.drawer + 1,
|
||||
transition: theme.transitions.create(['width', 'margin'], {
|
||||
easing: theme.transitions.easing.sharp,
|
||||
duration: theme.transitions.duration.leavingScreen,
|
||||
}),
|
||||
...(open && {
|
||||
marginLeft: drawerWidth,
|
||||
width: `calc(100% - ${drawerWidth}px)`,
|
||||
transition: theme.transitions.create(['width', 'margin'], {
|
||||
easing: theme.transitions.easing.sharp,
|
||||
duration: theme.transitions.duration.enteringScreen,
|
||||
}),
|
||||
}),
|
||||
}));
|
||||
|
||||
const Drawer = styled(MuiDrawer, { shouldForwardProp: (prop) => prop !== 'open' })(
|
||||
({ theme, open }) => ({
|
||||
'& .MuiDrawer-paper': {
|
||||
position: 'relative',
|
||||
whiteSpace: 'nowrap',
|
||||
width: drawerWidth,
|
||||
transition: theme.transitions.create('width', {
|
||||
easing: theme.transitions.easing.sharp,
|
||||
duration: theme.transitions.duration.enteringScreen,
|
||||
}),
|
||||
boxSizing: 'border-box',
|
||||
...(!open && {
|
||||
overflowX: 'hidden',
|
||||
transition: theme.transitions.create('width', {
|
||||
easing: theme.transitions.easing.sharp,
|
||||
duration: theme.transitions.duration.leavingScreen,
|
||||
}),
|
||||
width: theme.spacing(7),
|
||||
[theme.breakpoints.up('sm')]: {
|
||||
width: theme.spacing(9),
|
||||
},
|
||||
}),
|
||||
},
|
||||
}),
|
||||
);
|
||||
|
||||
|
||||
const SubscriptionNav = (props) => {
|
||||
const NavSubscriptionList = (props) => {
|
||||
const subscriptions = props.subscriptions;
|
||||
return (
|
||||
<>
|
||||
{subscriptions.map((id, subscription) =>
|
||||
<SubscriptionNavItem
|
||||
<NavSubscriptionItem
|
||||
key={id}
|
||||
subscription={subscription}
|
||||
selected={props.selectedSubscription && props.selectedSubscription.id === id}
|
||||
onClick={() => props.handleSubscriptionClick(id)}
|
||||
onClick={() => props.onSubscriptionClick(id)}
|
||||
/>)
|
||||
}
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
const SubscriptionNavItem = (props) => {
|
||||
const NavSubscriptionItem = (props) => {
|
||||
const subscription = props.subscription;
|
||||
return (
|
||||
<ListItemButton onClick={props.onClick} selected={props.selected}>
|
||||
@ -100,13 +54,115 @@ const SubscriptionNavItem = (props) => {
|
||||
);
|
||||
}
|
||||
|
||||
const NavList = (props) => {
|
||||
const [subscribeDialogOpen, setSubscribeDialogOpen] = useState(false);
|
||||
const handleSubscribeSubmit = (subscription) => {
|
||||
setSubscribeDialogOpen(false);
|
||||
props.onSubscribeSubmit(subscription);
|
||||
}
|
||||
return (
|
||||
<>
|
||||
<Toolbar />
|
||||
<Divider />
|
||||
<List component="nav">
|
||||
<NavSubscriptionList
|
||||
subscriptions={props.subscriptions}
|
||||
selectedSubscription={props.selectedSubscription}
|
||||
onSubscriptionClick={props.onSubscriptionClick}
|
||||
/>
|
||||
<Divider sx={{ my: 1 }} />
|
||||
<ListItemButton>
|
||||
<ListItemIcon>
|
||||
<SettingsIcon />
|
||||
</ListItemIcon>
|
||||
<ListItemText primary="Settings" />
|
||||
</ListItemButton>
|
||||
<ListItemButton onClick={() => setSubscribeDialogOpen(true)}>
|
||||
<ListItemIcon>
|
||||
<AddIcon />
|
||||
</ListItemIcon>
|
||||
<ListItemText primary="Add subscription" />
|
||||
</ListItemButton>
|
||||
</List>
|
||||
<SubscribeDialog
|
||||
open={subscribeDialogOpen}
|
||||
onCancel={() => setSubscribeDialogOpen(false)}
|
||||
onSubmit={handleSubscribeSubmit}
|
||||
/>
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
||||
const ActionBar = (props) => {
|
||||
const title = (props.selectedSubscription !== null)
|
||||
? props.selectedSubscription.shortUrl()
|
||||
: "ntfy";
|
||||
return (
|
||||
<AppBar position="fixed" sx={{ width: { sm: `calc(100% - ${drawerWidth}px)` }, ml: { sm: `${drawerWidth}px` } }}>
|
||||
<Toolbar sx={{pr: '24px'}}>
|
||||
<IconButton
|
||||
color="inherit"
|
||||
edge="start"
|
||||
onClick={props.onMobileDrawerToggle}
|
||||
sx={{ mr: 2, display: { sm: 'none' } }}
|
||||
>
|
||||
<MenuIcon />
|
||||
</IconButton>
|
||||
<Typography variant="h6" noWrap component="div" sx={{ flexGrow: 1 }}>{title}</Typography>
|
||||
{props.selectedSubscription !== null && <IconSubscribeSettings
|
||||
subscription={props.selectedSubscription}
|
||||
onClearAll={props.onClearAll}
|
||||
onUnsubscribe={props.onUnsubscribe}
|
||||
/>}
|
||||
</Toolbar>
|
||||
</AppBar>
|
||||
);
|
||||
};
|
||||
|
||||
const Sidebar = (props) => {
|
||||
const navigationList =
|
||||
<NavList
|
||||
subscriptions={props.subscriptions}
|
||||
selectedSubscription={props.selectedSubscription}
|
||||
onSubscriptionClick={props.onSubscriptionClick}
|
||||
onSubscribeSubmit={props.onSubscribeSubmit}
|
||||
/>;
|
||||
return (
|
||||
<>
|
||||
{/* Mobile drawer; only shown if menu icon clicked (mobile open) and display is small */}
|
||||
<Drawer
|
||||
variant="temporary"
|
||||
open={props.mobileDrawerOpen}
|
||||
onClose={props.onMobileDrawerToggle}
|
||||
ModalProps={{ keepMounted: true }} // Better open performance on mobile.
|
||||
sx={{
|
||||
display: { xs: 'block', sm: 'none' },
|
||||
'& .MuiDrawer-paper': { boxSizing: 'border-box', width: drawerWidth },
|
||||
}}
|
||||
>
|
||||
{navigationList}
|
||||
</Drawer>
|
||||
{/* Big screen drawer; persistent, shown if screen is big */}
|
||||
<Drawer
|
||||
open
|
||||
variant="permanent"
|
||||
sx={{
|
||||
display: { xs: 'none', sm: 'block' },
|
||||
'& .MuiDrawer-paper': { boxSizing: 'border-box', width: drawerWidth },
|
||||
}}
|
||||
>
|
||||
{navigationList}
|
||||
</Drawer>
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
||||
const App = () => {
|
||||
console.log(`[App] Rendering main view`);
|
||||
|
||||
const [drawerOpen, setDrawerOpen] = useState(true);
|
||||
const [mobileDrawerOpen, setMobileDrawerOpen] = useState(false);
|
||||
const [subscriptions, setSubscriptions] = useState(new Subscriptions());
|
||||
const [selectedSubscription, setSelectedSubscription] = useState(null);
|
||||
const [subscribeDialogOpen, setSubscribeDialogOpen] = useState(false);
|
||||
const handleNotification = (subscriptionId, notification) => {
|
||||
setSubscriptions(prev => {
|
||||
const newSubscription = prev.get(subscriptionId).addNotification(notification);
|
||||
@ -115,7 +171,6 @@ const App = () => {
|
||||
};
|
||||
const handleSubscribeSubmit = (subscription) => {
|
||||
console.log(`[App] New subscription: ${subscription.id}`);
|
||||
setSubscribeDialogOpen(false);
|
||||
setSubscriptions(prev => prev.add(subscription).clone());
|
||||
setSelectedSubscription(subscription);
|
||||
api.poll(subscription.baseUrl, subscription.topic)
|
||||
@ -126,10 +181,6 @@ const App = () => {
|
||||
});
|
||||
});
|
||||
};
|
||||
const handleSubscribeCancel = () => {
|
||||
console.log(`[App] Cancel clicked`);
|
||||
setSubscribeDialogOpen(false);
|
||||
};
|
||||
const handleClearAll = (subscriptionId) => {
|
||||
console.log(`[App] Deleting all notifications from ${subscriptionId}`);
|
||||
setSubscriptions(prev => {
|
||||
@ -145,14 +196,7 @@ const App = () => {
|
||||
return newSubscriptions;
|
||||
});
|
||||
};
|
||||
const handleSubscriptionClick = (subscriptionId) => {
|
||||
console.log(`[App] Selected ${subscriptionId}`);
|
||||
setSelectedSubscription(subscriptions.get(subscriptionId));
|
||||
};
|
||||
const notifications = (selectedSubscription !== null) ? selectedSubscription.getNotifications() : [];
|
||||
const toggleDrawer = () => {
|
||||
setDrawerOpen(!drawerOpen);
|
||||
};
|
||||
useEffect(() => {
|
||||
setSubscriptions(repository.loadSubscriptions());
|
||||
}, [/* initial render only */]);
|
||||
@ -160,96 +204,42 @@ const App = () => {
|
||||
connectionManager.refresh(subscriptions, handleNotification);
|
||||
repository.saveSubscriptions(subscriptions);
|
||||
}, [subscriptions]);
|
||||
|
||||
return (
|
||||
<ThemeProvider theme={theme}>
|
||||
<CssBaseline />
|
||||
<Box sx={{ display: 'flex' }}>
|
||||
<AppBar position="absolute" open={drawerOpen}>
|
||||
<Toolbar sx={{pr: '24px'}} color="primary">
|
||||
<IconButton
|
||||
edge="start"
|
||||
color="inherit"
|
||||
aria-label="open drawer"
|
||||
onClick={toggleDrawer}
|
||||
sx={{
|
||||
marginRight: '36px',
|
||||
...(drawerOpen && { display: 'none' }),
|
||||
}}
|
||||
>
|
||||
<MenuIcon />
|
||||
</IconButton>
|
||||
<Typography
|
||||
component="h1"
|
||||
variant="h6"
|
||||
color="inherit"
|
||||
noWrap
|
||||
sx={{ flexGrow: 1 }}
|
||||
>
|
||||
{(selectedSubscription !== null) ? selectedSubscription.shortUrl() : "ntfy"}
|
||||
</Typography>
|
||||
{selectedSubscription !== null && <SubscriptionSettings
|
||||
subscription={selectedSubscription}
|
||||
<CssBaseline/>
|
||||
<Box sx={{display: 'flex'}}>
|
||||
<CssBaseline/>
|
||||
<ActionBar
|
||||
selectedSubscription={selectedSubscription}
|
||||
onClearAll={handleClearAll}
|
||||
onUnsubscribe={handleUnsubscribe}
|
||||
/>}
|
||||
</Toolbar>
|
||||
</AppBar>
|
||||
<Drawer variant="permanent" open={drawerOpen}>
|
||||
<Toolbar
|
||||
sx={{
|
||||
display: 'flex',
|
||||
alignItems: 'center',
|
||||
justifyContent: 'flex-end',
|
||||
px: [1],
|
||||
}}
|
||||
>
|
||||
<IconButton onClick={toggleDrawer}>
|
||||
<ChevronLeftIcon />
|
||||
</IconButton>
|
||||
</Toolbar>
|
||||
<Divider />
|
||||
<List component="nav">
|
||||
<SubscriptionNav
|
||||
onMobileDrawerToggle={() => setMobileDrawerOpen(!mobileDrawerOpen)}
|
||||
/>
|
||||
<Box component="nav" sx={{width: {sm: drawerWidth}, flexShrink: {sm: 0}}}>
|
||||
<Sidebar
|
||||
subscriptions={subscriptions}
|
||||
selectedSubscription={selectedSubscription}
|
||||
handleSubscriptionClick={handleSubscriptionClick}
|
||||
mobileDrawerOpen={mobileDrawerOpen}
|
||||
onMobileDrawerToggle={() => setMobileDrawerOpen(!mobileDrawerOpen)}
|
||||
onSubscriptionClick={(subscriptionId) => setSelectedSubscription(subscriptions.get(subscriptionId))}
|
||||
onSubscribeSubmit={handleSubscribeSubmit}
|
||||
/>
|
||||
<Divider sx={{ my: 1 }} />
|
||||
<ListItemButton>
|
||||
<ListItemIcon>
|
||||
<SettingsIcon />
|
||||
</ListItemIcon>
|
||||
<ListItemText primary="Settings" />
|
||||
</ListItemButton>
|
||||
<ListItemButton onClick={() => setSubscribeDialogOpen(true)}>
|
||||
<ListItemIcon>
|
||||
<AddIcon />
|
||||
</ListItemIcon>
|
||||
<ListItemText primary="Add subscription" />
|
||||
</ListItemButton>
|
||||
</List>
|
||||
</Drawer>
|
||||
</Box>
|
||||
<Box
|
||||
component="main"
|
||||
sx={{
|
||||
backgroundColor: (theme) =>
|
||||
theme.palette.mode === 'light'
|
||||
? theme.palette.grey[100]
|
||||
: theme.palette.grey[900],
|
||||
flexGrow: 1,
|
||||
p: 3,
|
||||
width: {sm: `calc(100% - ${drawerWidth}px)`},
|
||||
height: '100vh',
|
||||
overflow: 'auto',
|
||||
}}
|
||||
>
|
||||
<Toolbar />
|
||||
backgroundColor: (theme) => theme.palette.mode === 'light' ? theme.palette.grey[100] : theme.palette.grey[900]
|
||||
}}>
|
||||
<Toolbar/>
|
||||
<NotificationList notifications={notifications}/>
|
||||
</Box>
|
||||
</Box>
|
||||
<AddDialog
|
||||
open={subscribeDialogOpen}
|
||||
onCancel={handleSubscribeCancel}
|
||||
onSubmit={handleSubscribeSubmit}
|
||||
/>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
|
@ -11,7 +11,7 @@ import MoreVertIcon from "@mui/icons-material/MoreVert";
|
||||
import api from "../app/Api";
|
||||
|
||||
// Originally from https://mui.com/components/menus/#MenuListComposition.js
|
||||
const SubscriptionSettings = (props) => {
|
||||
const IconSubscribeSettings = (props) => {
|
||||
const [open, setOpen] = useState(false);
|
||||
const anchorRef = useRef(null);
|
||||
|
||||
@ -114,4 +114,4 @@ const SubscriptionSettings = (props) => {
|
||||
);
|
||||
}
|
||||
|
||||
export default SubscriptionSettings;
|
||||
export default IconSubscribeSettings;
|
@ -12,7 +12,7 @@ import Subscription from "../app/Subscription";
|
||||
const defaultBaseUrl = "http://127.0.0.1"
|
||||
//const defaultBaseUrl = "https://ntfy.sh"
|
||||
|
||||
const AddDialog = (props) => {
|
||||
const SubscribeDialog = (props) => {
|
||||
const [topic, setTopic] = useState("");
|
||||
const handleCancel = () => {
|
||||
setTopic('');
|
||||
@ -53,4 +53,4 @@ const AddDialog = (props) => {
|
||||
);
|
||||
};
|
||||
|
||||
export default AddDialog;
|
||||
export default SubscribeDialog;
|
Loading…
Reference in New Issue
Block a user