Line width
This commit is contained in:
parent
2e27f58963
commit
ca5d736a71
33 changed files with 521 additions and 2033 deletions
|
@ -6,13 +6,7 @@ import Dialog from "@mui/material/Dialog";
|
|||
import DialogContent from "@mui/material/DialogContent";
|
||||
import DialogContentText from "@mui/material/DialogContentText";
|
||||
import DialogTitle from "@mui/material/DialogTitle";
|
||||
import {
|
||||
Chip,
|
||||
InputAdornment,
|
||||
Portal,
|
||||
Snackbar,
|
||||
useMediaQuery,
|
||||
} from "@mui/material";
|
||||
import { Chip, InputAdornment, Portal, Snackbar, useMediaQuery } from "@mui/material";
|
||||
import theme from "./theme";
|
||||
import subscriptionManager from "../app/SubscriptionManager";
|
||||
import DialogFooter from "./DialogFooter";
|
||||
|
@ -28,11 +22,7 @@ import { useNavigate } from "react-router-dom";
|
|||
import IconButton from "@mui/material/IconButton";
|
||||
import { Clear } from "@mui/icons-material";
|
||||
import { AccountContext } from "./App";
|
||||
import {
|
||||
ReserveAddDialog,
|
||||
ReserveDeleteDialog,
|
||||
ReserveEditDialog,
|
||||
} from "./ReserveDialogs";
|
||||
import { ReserveAddDialog, ReserveDeleteDialog, ReserveEditDialog } from "./ReserveDialogs";
|
||||
import { UnauthorizedError } from "../app/errors";
|
||||
|
||||
export const SubscriptionPopup = (props) => {
|
||||
|
@ -48,19 +38,11 @@ export const SubscriptionPopup = (props) => {
|
|||
const placement = props.placement ?? "left";
|
||||
const reservations = account?.reservations || [];
|
||||
|
||||
const showReservationAdd =
|
||||
config.enable_reservations &&
|
||||
!subscription?.reservation &&
|
||||
account?.stats.reservations_remaining > 0;
|
||||
const showReservationAdd = config.enable_reservations && !subscription?.reservation && account?.stats.reservations_remaining > 0;
|
||||
const showReservationAddDisabled =
|
||||
!showReservationAdd &&
|
||||
config.enable_reservations &&
|
||||
!subscription?.reservation &&
|
||||
(config.enable_payments || account?.stats.reservations_remaining === 0);
|
||||
const showReservationEdit =
|
||||
config.enable_reservations && !!subscription?.reservation;
|
||||
const showReservationDelete =
|
||||
config.enable_reservations && !!subscription?.reservation;
|
||||
!showReservationAdd && config.enable_reservations && !subscription?.reservation && (config.enable_payments || account?.stats.reservations_remaining === 0);
|
||||
const showReservationEdit = config.enable_reservations && !!subscription?.reservation;
|
||||
const showReservationDelete = config.enable_reservations && !!subscription?.reservation;
|
||||
|
||||
const handleChangeDisplayName = async () => {
|
||||
setDisplayNameDialogOpen(true);
|
||||
|
@ -115,14 +97,10 @@ export const SubscriptionPopup = (props) => {
|
|||
])[0];
|
||||
const nowSeconds = Math.round(Date.now() / 1000);
|
||||
const message = shuffle([
|
||||
`Hello friend, this is a test notification from ntfy web. It's ${formatShortDateTime(
|
||||
nowSeconds
|
||||
)} right now. Is that early or late?`,
|
||||
`Hello friend, this is a test notification from ntfy web. It's ${formatShortDateTime(nowSeconds)} right now. Is that early or late?`,
|
||||
`So I heard you like ntfy? If that's true, go to GitHub and star it, or to the Play store and rate it. Thanks! Oh yeah, this is a test notification.`,
|
||||
`It's almost like you want to hear what I have to say. I'm not even a machine. I'm just a sentence that Phil typed on a random Thursday.`,
|
||||
`Alright then, it's ${formatShortDateTime(
|
||||
nowSeconds
|
||||
)} already. Boy oh boy, where did the time go? I hope you're alright, friend.`,
|
||||
`Alright then, it's ${formatShortDateTime(nowSeconds)} already. Boy oh boy, where did the time go? I hope you're alright, friend.`,
|
||||
`There are nine million bicycles in Beijing That's a fact; It's a thing we can't deny. I wonder if that's true ...`,
|
||||
`I'm really excited that you're trying out ntfy. Did you know that there are a few public topics, such as ntfy.sh/stats and ntfy.sh/announcements.`,
|
||||
`It's interesting to hear what people use ntfy for. I've heard people talk about using it for so many cool things. What do you use it for?`,
|
||||
|
@ -140,24 +118,16 @@ export const SubscriptionPopup = (props) => {
|
|||
};
|
||||
|
||||
const handleClearAll = async () => {
|
||||
console.log(
|
||||
`[SubscriptionPopup] Deleting all notifications from ${props.subscription.id}`
|
||||
);
|
||||
console.log(`[SubscriptionPopup] Deleting all notifications from ${props.subscription.id}`);
|
||||
await subscriptionManager.deleteNotifications(props.subscription.id);
|
||||
};
|
||||
|
||||
const handleUnsubscribe = async () => {
|
||||
console.log(
|
||||
`[SubscriptionPopup] Unsubscribing from ${props.subscription.id}`,
|
||||
props.subscription
|
||||
);
|
||||
console.log(`[SubscriptionPopup] Unsubscribing from ${props.subscription.id}`, props.subscription);
|
||||
await subscriptionManager.remove(props.subscription.id);
|
||||
if (session.exists() && !subscription.internal) {
|
||||
try {
|
||||
await accountApi.deleteSubscription(
|
||||
props.subscription.baseUrl,
|
||||
props.subscription.topic
|
||||
);
|
||||
await accountApi.deleteSubscription(props.subscription.baseUrl, props.subscription.topic);
|
||||
} catch (e) {
|
||||
console.log(`[SubscriptionPopup] Error unsubscribing`, e);
|
||||
if (e instanceof UnauthorizedError) {
|
||||
|
@ -175,67 +145,26 @@ export const SubscriptionPopup = (props) => {
|
|||
|
||||
return (
|
||||
<>
|
||||
<PopupMenu
|
||||
horizontal={placement}
|
||||
anchorEl={props.anchor}
|
||||
open={!!props.anchor}
|
||||
onClose={props.onClose}
|
||||
>
|
||||
<MenuItem onClick={handleChangeDisplayName}>
|
||||
{t("action_bar_change_display_name")}
|
||||
</MenuItem>
|
||||
{showReservationAdd && (
|
||||
<MenuItem onClick={handleReserveAdd}>
|
||||
{t("action_bar_reservation_add")}
|
||||
</MenuItem>
|
||||
)}
|
||||
<PopupMenu horizontal={placement} anchorEl={props.anchor} open={!!props.anchor} onClose={props.onClose}>
|
||||
<MenuItem onClick={handleChangeDisplayName}>{t("action_bar_change_display_name")}</MenuItem>
|
||||
{showReservationAdd && <MenuItem onClick={handleReserveAdd}>{t("action_bar_reservation_add")}</MenuItem>}
|
||||
{showReservationAddDisabled && (
|
||||
<MenuItem sx={{ cursor: "default" }}>
|
||||
<span style={{ opacity: 0.3 }}>
|
||||
{t("action_bar_reservation_add")}
|
||||
</span>
|
||||
<span style={{ opacity: 0.3 }}>{t("action_bar_reservation_add")}</span>
|
||||
<ReserveLimitChip />
|
||||
</MenuItem>
|
||||
)}
|
||||
{showReservationEdit && (
|
||||
<MenuItem onClick={handleReserveEdit}>
|
||||
{t("action_bar_reservation_edit")}
|
||||
</MenuItem>
|
||||
)}
|
||||
{showReservationDelete && (
|
||||
<MenuItem onClick={handleReserveDelete}>
|
||||
{t("action_bar_reservation_delete")}
|
||||
</MenuItem>
|
||||
)}
|
||||
<MenuItem onClick={handleSendTestMessage}>
|
||||
{t("action_bar_send_test_notification")}
|
||||
</MenuItem>
|
||||
<MenuItem onClick={handleClearAll}>
|
||||
{t("action_bar_clear_notifications")}
|
||||
</MenuItem>
|
||||
<MenuItem onClick={handleUnsubscribe}>
|
||||
{t("action_bar_unsubscribe")}
|
||||
</MenuItem>
|
||||
{showReservationEdit && <MenuItem onClick={handleReserveEdit}>{t("action_bar_reservation_edit")}</MenuItem>}
|
||||
{showReservationDelete && <MenuItem onClick={handleReserveDelete}>{t("action_bar_reservation_delete")}</MenuItem>}
|
||||
<MenuItem onClick={handleSendTestMessage}>{t("action_bar_send_test_notification")}</MenuItem>
|
||||
<MenuItem onClick={handleClearAll}>{t("action_bar_clear_notifications")}</MenuItem>
|
||||
<MenuItem onClick={handleUnsubscribe}>{t("action_bar_unsubscribe")}</MenuItem>
|
||||
</PopupMenu>
|
||||
<Portal>
|
||||
<Snackbar
|
||||
open={showPublishError}
|
||||
autoHideDuration={3000}
|
||||
onClose={() => setShowPublishError(false)}
|
||||
message={t("message_bar_error_publishing")}
|
||||
/>
|
||||
<DisplayNameDialog
|
||||
open={displayNameDialogOpen}
|
||||
subscription={subscription}
|
||||
onClose={() => setDisplayNameDialogOpen(false)}
|
||||
/>
|
||||
<Snackbar open={showPublishError} autoHideDuration={3000} onClose={() => setShowPublishError(false)} message={t("message_bar_error_publishing")} />
|
||||
<DisplayNameDialog open={displayNameDialogOpen} subscription={subscription} onClose={() => setDisplayNameDialogOpen(false)} />
|
||||
{showReservationAdd && (
|
||||
<ReserveAddDialog
|
||||
open={reserveAddDialogOpen}
|
||||
topic={subscription.topic}
|
||||
reservations={reservations}
|
||||
onClose={() => setReserveAddDialogOpen(false)}
|
||||
/>
|
||||
<ReserveAddDialog open={reserveAddDialogOpen} topic={subscription.topic} reservations={reservations} onClose={() => setReserveAddDialogOpen(false)} />
|
||||
)}
|
||||
{showReservationEdit && (
|
||||
<ReserveEditDialog
|
||||
|
@ -246,11 +175,7 @@ export const SubscriptionPopup = (props) => {
|
|||
/>
|
||||
)}
|
||||
{showReservationDelete && (
|
||||
<ReserveDeleteDialog
|
||||
open={reserveDeleteDialogOpen}
|
||||
topic={subscription.topic}
|
||||
onClose={() => setReserveDeleteDialogOpen(false)}
|
||||
/>
|
||||
<ReserveDeleteDialog open={reserveDeleteDialogOpen} topic={subscription.topic} onClose={() => setReserveDeleteDialogOpen(false)} />
|
||||
)}
|
||||
</Portal>
|
||||
</>
|
||||
|
@ -261,28 +186,17 @@ const DisplayNameDialog = (props) => {
|
|||
const { t } = useTranslation();
|
||||
const subscription = props.subscription;
|
||||
const [error, setError] = useState("");
|
||||
const [displayName, setDisplayName] = useState(
|
||||
subscription.displayName ?? ""
|
||||
);
|
||||
const [displayName, setDisplayName] = useState(subscription.displayName ?? "");
|
||||
const fullScreen = useMediaQuery(theme.breakpoints.down("sm"));
|
||||
|
||||
const handleSave = async () => {
|
||||
await subscriptionManager.setDisplayName(subscription.id, displayName);
|
||||
if (session.exists() && !subscription.internal) {
|
||||
try {
|
||||
console.log(
|
||||
`[SubscriptionSettingsDialog] Updating subscription display name to ${displayName}`
|
||||
);
|
||||
await accountApi.updateSubscription(
|
||||
subscription.baseUrl,
|
||||
subscription.topic,
|
||||
{ display_name: displayName }
|
||||
);
|
||||
console.log(`[SubscriptionSettingsDialog] Updating subscription display name to ${displayName}`);
|
||||
await accountApi.updateSubscription(subscription.baseUrl, subscription.topic, { display_name: displayName });
|
||||
} catch (e) {
|
||||
console.log(
|
||||
`[SubscriptionSettingsDialog] Error updating subscription`,
|
||||
e
|
||||
);
|
||||
console.log(`[SubscriptionSettingsDialog] Error updating subscription`, e);
|
||||
if (e instanceof UnauthorizedError) {
|
||||
session.resetAndRedirect(routes.login);
|
||||
} else {
|
||||
|
@ -295,18 +209,10 @@ const DisplayNameDialog = (props) => {
|
|||
};
|
||||
|
||||
return (
|
||||
<Dialog
|
||||
open={props.open}
|
||||
onClose={props.onClose}
|
||||
maxWidth="sm"
|
||||
fullWidth
|
||||
fullScreen={fullScreen}
|
||||
>
|
||||
<Dialog open={props.open} onClose={props.onClose} maxWidth="sm" fullWidth fullScreen={fullScreen}>
|
||||
<DialogTitle>{t("display_name_dialog_title")}</DialogTitle>
|
||||
<DialogContent>
|
||||
<DialogContentText>
|
||||
{t("display_name_dialog_description")}
|
||||
</DialogContentText>
|
||||
<DialogContentText>{t("display_name_dialog_description")}</DialogContentText>
|
||||
<TextField
|
||||
autoFocus
|
||||
placeholder={t("display_name_dialog_placeholder")}
|
||||
|
@ -340,17 +246,10 @@ const DisplayNameDialog = (props) => {
|
|||
|
||||
export const ReserveLimitChip = () => {
|
||||
const { account } = useContext(AccountContext);
|
||||
if (
|
||||
account?.role === Role.ADMIN ||
|
||||
account?.stats.reservations_remaining > 0
|
||||
) {
|
||||
if (account?.role === Role.ADMIN || account?.stats.reservations_remaining > 0) {
|
||||
return <></>;
|
||||
} else if (config.enable_payments) {
|
||||
return account?.limits.reservations > 0 ? (
|
||||
<LimitReachedChip />
|
||||
) : (
|
||||
<ProChip />
|
||||
);
|
||||
return account?.limits.reservations > 0 ? <LimitReachedChip /> : <ProChip />;
|
||||
} else if (account) {
|
||||
return <LimitReachedChip />;
|
||||
}
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue