Reserved topics dialog

pull/584/head
binwiederhier 2023-01-02 10:46:37 -05:00
parent 7487b0da58
commit 1256ba0429
2 changed files with 97 additions and 17 deletions

View File

@ -250,6 +250,10 @@
"prefs_access_table_perms_private": "Only I can publish and subscribe",
"prefs_access_table_perms_public_read": "I can publish, everyone can subscribe",
"prefs_access_table_perms_public": "Everyone can publish and subscribe",
"prefs_access_dialog_title_add": "Reserve topic",
"prefs_access_dialog_title_edit": "Edit reserved topic",
"prefs_access_dialog_topic_label": "Topic",
"prefs_access_dialog_access_label": "Access",
"priority_min": "min",
"priority_low": "low",
"priority_default": "default",

View File

@ -5,7 +5,7 @@ import {
CardContent,
FormControl,
Select,
Stack,
Stack, styled,
Table,
TableBody,
TableCell,
@ -41,6 +41,9 @@ import accountApi, {UnauthorizedError} from "../app/AccountApi";
import {Pref, PrefGroup} from "./Pref";
import {useOutletContext} from "react-router-dom";
import LockIcon from "@mui/icons-material/Lock";
import {Public, PublicOff} from "@mui/icons-material";
import ListItemIcon from "@mui/material/ListItemIcon";
import ListItemText from "@mui/material/ListItemText";
const Preferences = () => {
return (
@ -515,14 +518,14 @@ const Access = () => {
</CardContent>
<CardActions>
<Button onClick={handleAddClick}>{t("prefs_access_add_button")}</Button>
{/*<UserDialog
key={`userEditDialog${dialogKey}`}
<AccessDialog
key={`accessAddDialog${dialogKey}`}
open={dialogOpen}
user={dialogUser}
users={props.users}
entry={null}
entries={account.access}
onCancel={handleDialogCancel}
onSubmit={handleDialogSubmit}
/>*/}
/>
</CardActions>
</Card>
);
@ -532,11 +535,11 @@ const AccessTable = (props) => {
const { t } = useTranslation();
const [dialogKey, setDialogKey] = useState(0);
const [dialogOpen, setDialogOpen] = useState(false);
const [dialogUser, setDialogUser] = useState(null);
const [dialogEntry, setDialogEntry] = useState(null);
const handleEditClick = (user) => {
const handleEditClick = (entry) => {
setDialogKey(prev => prev+1);
setDialogUser(user);
setDialogEntry(entry);
setDialogOpen(true);
};
@ -584,18 +587,91 @@ const AccessTable = (props) => {
</TableRow>
))}
</TableBody>
{/*<UserDialog
key={`userEditDialog${dialogKey}`}
<AccessDialog
key={`accessEditDialog${dialogKey}`}
open={dialogOpen}
user={dialogUser}
users={props.users}
entry={dialogEntry}
entries={props.entries}
onCancel={handleDialogCancel}
onSubmit={handleDialogSubmit}
/>*/}
/>
</Table>
);
};
const AccessDialog = (props) => {
const { t } = useTranslation();
const [topic, setTopic] = useState("");
const [access, setAccess] = useState("private");
const fullScreen = useMediaQuery(theme.breakpoints.down('sm'));
const editMode = props.entry !== null;
const addButtonEnabled = (() => {
// FIXME
})();
const handleSubmit = async () => {
props.onSubmit({
topic: topic,
// FIXME
})
};
useEffect(() => {
if (editMode) {
setTopic(props.topic);
//setAccess(props.access);
}
}, [editMode, props]);
return (
<Dialog open={props.open} onClose={props.onCancel} maxWidth="xs" fullWidth fullScreen={fullScreen}>
<DialogTitle>{editMode ? t("prefs_access_dialog_title_edit") : t("prefs_access_dialog_title_add")}</DialogTitle>
<DialogContent>
{!editMode && <TextField
autoFocus
margin="dense"
id="topic"
label={t("prefs_access_dialog_topic_label")}
aria-label={t("prefs_access_dialog_topic_label")}
value={topic}
onChange={ev => setTopic(ev.target.value)}
type="url"
fullWidth
variant="standard"
/>}
<FormControl fullWidth variant="standard">
<Select
value={access}
onChange={(ev) => setAccess(ev.target.value)}
aria-label={t("prefs_access_dialog_access_label")}
sx={{
marginTop: 1,
"& .MuiSelect-select": {
display: 'flex',
alignItems: 'center'
}
}}
>
<MenuItem value="private">
<ListItemIcon><LockIcon /></ListItemIcon>
<ListItemText primary={t("prefs_access_table_perms_private")} />
</MenuItem>
<MenuItem value="public-read">
<ListItemIcon><PublicOff /></ListItemIcon>
<ListItemText primary={t("prefs_access_table_perms_public_read")} />
</MenuItem>
<MenuItem value="public">
<ListItemIcon><Public /></ListItemIcon>
<ListItemText primary={t("prefs_access_table_perms_public")} />
</MenuItem>
</Select>
</FormControl>
</DialogContent>
<DialogActions>
<Button onClick={props.onCancel}>{t("prefs_users_dialog_button_cancel")}</Button>
<Button onClick={handleSubmit} disabled={!addButtonEnabled}>{editMode ? t("prefs_users_dialog_button_save") : t("prefs_users_dialog_button_add")}</Button>
</DialogActions>
</Dialog>
);
};
const maybeUpdateAccountSettings = async (payload) => {
if (!session.exists()) {
return;