Add "spawn new" button

This commit is contained in:
Narek Amirbekian
2022-02-09 12:59:34 -08:00
parent 359f9055fc
commit 0b25694b40
2 changed files with 105 additions and 71 deletions

View File

@@ -29,6 +29,7 @@ const ServerDashboard = (props) => {
var [errorAlert, setErrorAlert] = useState(null); var [errorAlert, setErrorAlert] = useState(null);
var [sortMethod, setSortMethod] = useState(null); var [sortMethod, setSortMethod] = useState(null);
var [disabledButtons, setDisabledButtons] = useState({});
var user_data = useSelector((state) => state.user_data), var user_data = useSelector((state) => state.user_data),
user_page = useSelector((state) => state.user_page), user_page = useSelector((state) => state.user_page),
@@ -241,9 +242,10 @@ const ServerDashboard = (props) => {
...(e.servers || {}), ...(e.servers || {}),
}); });
return userServers.map((server) => { return userServers.map((server) => {
server = { name: "", ...server };
return ( return (
<tr key={i + "row"} className="user-row"> <tr key={i + "row"} className="user-row">
{!(server || {}).name && ( {!server.name && (
<td <td
data-testid="user-row-name" data-testid="user-row-name"
rowspan={userServers.length} rowspan={userServers.length}
@@ -251,7 +253,7 @@ const ServerDashboard = (props) => {
{e.name} {e.name}
</td> </td>
)} )}
{!(server || {}).name && ( {!server.name && (
<td <td
data-testid="user-row-admin" data-testid="user-row-admin"
rowspan={userServers.length} rowspan={userServers.length}
@@ -261,72 +263,116 @@ const ServerDashboard = (props) => {
)} )}
<td data-testid="user-row-name"> <td data-testid="user-row-name">
{(server || {}).name || "[MAIN]"} {server.name || "[MAIN]"}
</td> </td>
<td data-testid="user-row-last-activity"> <td data-testid="user-row-last-activity">
{(server || {}).last_activity {server.last_activity
? timeSince(server.last_activity) ? timeSince(server.last_activity)
: "Never"} : "Never"}
</td> </td>
<td data-testid="user-row-server-activity"> <td data-testid="user-row-server-activity">
{server != null ? ( {server.started ? (
// Stop Single-user server // Stop Single-user server
<button <>
className="btn btn-danger btn-xs stop-button" <button
onClick={() => className="btn btn-danger btn-xs stop-button"
stopServer(e.name, server.name) disabled={
.then((res) => { disabledButtons[
if (res.status < 300) { `stop__${e.name}__${server.name}`
updateUsers(...slice) ] || false
.then((data) => { }
dispatchPageUpdate(data, page); onClick={() => {
}) setDisabledButtons({
.catch(() => [`stop__${e.name}__${server.name}`]: true,
setErrorAlert( });
`Failed to update users list.` stopServer(e.name, server.name)
) .then((res) => {
); if (res.status < 300) {
} else { updateUsers(...slice)
setErrorAlert(`Failed to stop server.`); .then((data) => {
} dispatchPageUpdate(data, page);
return res; })
}) .catch(() =>
.catch(() => setErrorAlert(
setErrorAlert(`Failed to stop server.`) `Failed to update users list.`
) )
} );
> } else {
Stop Server setErrorAlert(`Failed to stop server.`);
</button> }
return res;
})
.catch(() =>
setErrorAlert(`Failed to stop server.`)
);
}}
>
Stop Server
</button>
<a
href={`/user/${e.name}${
server && server.name && "/" + server.name
}`}
>
<button
className="btn btn-primary btn-xs"
style={{ marginRight: 20 }}
>
Access Server
</button>
</a>
</>
) : ( ) : (
// Start Single-user server // Start Single-user server
<button <>
className="btn btn-primary btn-xs start-button" <button
onClick={() => className="btn btn-success btn-xs start-button"
startServer(e.name, (server || {}).name) disabled={
.then((res) => { disabledButtons[
if (res.status < 300) { `start__${e.name}__${server.name}`
updateUsers(...slice) ] || false
.then((data) => { }
dispatchPageUpdate(data, page); onClick={() => {
}) setDisabledButtons({
.catch(() => [`start__${e.name}__${server.name}`]: true,
setErrorAlert( });
`Failed to update users list.` startServer(e.name, (server || {}).name)
) .then((res) => {
); if (res.status < 300) {
} else { updateUsers(...slice)
.then((data) => {
dispatchPageUpdate(data, page);
})
.catch(() =>
setErrorAlert(
`Failed to update users list.`
)
);
} else {
setErrorAlert(`Failed to start server.`);
}
return res;
})
.catch(() => {
setErrorAlert(`Failed to start server.`); setErrorAlert(`Failed to start server.`);
} });
return res; }}
}) >
.catch(() => { Restart Server
setErrorAlert(`Failed to start server.`); </button>
}) <a
} href={`/spawn/${e.name}${
> server.name && "/" + server.name
Start Server }`}
</button> >
<button
className="btn btn-secondary btn-xs"
style={{ marginRight: 20 }}
>
Spawn New
</button>
</a>
</>
)} )}
</td> </td>
<td> <td>
@@ -346,18 +392,6 @@ const ServerDashboard = (props) => {
> >
edit user edit user
</button> </button>
<a
href={`/user/${e.name}${
server && server.name && "/" + server.name
}`}
>
<button
className="btn btn-primary btn-xs"
style={{ marginRight: 20 }}
>
Access Server
</button>
</a>
</td> </td>
</tr> </tr>
); );

File diff suppressed because one or more lines are too long