kenmirrors/ente
1
0
Fork 0
mirror of https://github.com/ente-io/ente.git synced 2025-08-08 07:28:26 +00:00
Code Issues Packages Projects Releases Wiki Activity

[staff] Lint fixes

Browse Source
This commit is contained in:
Neeraj Gupta 2024-11-27 09:16:10 +05:30
parent f2d3a63c18
commit 8d32cba241
3 changed files with 130 additions and 36 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
infra/staff/src/App.tsx
View File

@ -9,11 +9,11 @@ import { useEffect, useState } from "react";
import "./App.css";
import FamilyTableComponent from "./components/FamilyComponentTable";
import StorageBonusTableComponent from "./components/StorageBonusTableComponent";
import TokensTableComponent from "./components/TokenTableComponent";
import type { UserData } from "./components/UserComponent";
import UserComponent from "./components/UserComponent";
import duckieimage from "./components/duckie.png";
import { apiOrigin } from "./services/support";
import TokensTableComponent from "./components/TokenTableComponent";
export let email = "";
export let token = "";
@ -184,8 +184,12 @@ const App: React.FC = () => {
.isTwoFactorEnabled
? "Enabled"
: "Disabled",
"Passkeys": (userDataResponse.details?.profileData.passkeyCount ?? 0) > 0 ? "Enabled" : "Disabled",
"AuthCodes" : `${userDataResponse.authCodes ?? 0}`,
Passkeys:
(userDataResponse.details?.profileData.passkeyCount ??
0) > 0
? "Enabled"
: "Disabled",
AuthCodes: `${userDataResponse.authCodes ?? 0}`,
},
};

52
infra/staff/src/components/TokenTableComponent.tsx
View File

@ -106,21 +106,40 @@ const TokensTableComponent: React.FC = () => {
<Table aria-label="tokens-table">
<TableHead>
<TableRow>
<TableCell sortDirection={orderBy === "creationTime" ? order : false}>
<TableCell
sortDirection={
orderBy === "creationTime" ? order : false
}
>
<TableSortLabel
active={orderBy === "creationTime"}
direction={orderBy === "creationTime" ? order : "asc"}
onClick={() => handleRequestSort("creationTime")}
direction={
orderBy === "creationTime"
? order
: "asc"
}
onClick={() =>
handleRequestSort("creationTime")
}
>
Created At
</TableSortLabel>
</TableCell>
<TableCell sortDirection={orderBy === "lastUsedTime" ? order : false}>
<TableCell
sortDirection={
orderBy === "lastUsedTime" ? order : false
}
>
<TableSortLabel
active={orderBy === "lastUsedTime"}
direction={orderBy === "lastUsedTime" ? order : "asc"}
onClick={() => handleRequestSort("lastUsedTime")}
direction={
orderBy === "lastUsedTime"
? order
: "asc"
}
onClick={() =>
handleRequestSort("lastUsedTime")
}
>
Last Used At
</TableSortLabel>
@ -139,16 +158,23 @@ const TokensTableComponent: React.FC = () => {
<TableBody>
{sortedTokens.map((token, index) => (
<TableRow key={index}>
<TableCell>{formatDate(token.creationTime)}</TableCell>
<TableCell>{formatDate(token.lastUsedTime)}</TableCell>
<TableCell>
{formatDate(token.creationTime)}
</TableCell>
<TableCell>
{formatDate(token.lastUsedTime)}
</TableCell>
<TableCell>{token.ua}</TableCell>
<TableCell>{token.app}</TableCell>
<TableCell>
<span
style={{
backgroundColor: token.isDeleted ? "#494949" : "transparent",
color: token.isDeleted ? "white" : "inherit",
backgroundColor: token.isDeleted
? "#494949"
: "transparent",
color: token.isDeleted
? "white"
: "inherit",
padding: "4px 8px",
borderRadius: "10px",
}}
@ -165,4 +191,4 @@ const TokensTableComponent: React.FC = () => {
);
};
export default TokensTableComponent;
export default TokensTableComponent;

104
infra/staff/src/components/UserComponent.tsx
View File

@ -34,7 +34,8 @@ const UserComponent: React.FC<UserComponentProps> = ({ userData }) => {
const [deleteAccountOpen, setDeleteAccountOpen] = React.useState(false);
const [disable2FAOpen, setDisable2FAOpen] = React.useState(false);
const [twoFactorEnabled, setTwoFactorEnabled] = React.useState(false);
const [updateSubscriptionOpen, setUpdateSubscriptionOpen] = React.useState(false);
const [updateSubscriptionOpen, setUpdateSubscriptionOpen] =
React.useState(false);
const [changeEmailOpen, setChangeEmailOpen] = React.useState(false);
const [disablePasskeysOpen, setDisablePasskeysOpen] = React.useState(false);
@ -55,6 +56,7 @@ const UserComponent: React.FC<UserComponentProps> = ({ userData }) => {
<Grid item xs={12} sm={10} md={6} key={title}>
<DataTable
title={title}
// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment
data={data}
onEditEmail={handleEditEmail}
onDeleteAccount={handleDeleteAccountClick}
@ -67,11 +69,28 @@ const UserComponent: React.FC<UserComponentProps> = ({ userData }) => {
</Grid>
))}
<DeleteAccount open={deleteAccountOpen} handleClose={() => setDeleteAccountOpen(false)} />
<Disable2FA open={disable2FAOpen} handleClose={() => setDisable2FAOpen(false)} handleDisable2FA={() => setTwoFactorEnabled(false)} />
<UpdateSubscription open={updateSubscriptionOpen} onClose={() => setUpdateSubscriptionOpen(false)} />
<ChangeEmail open={changeEmailOpen} onClose={() => setChangeEmailOpen(false)} />
<DisablePasskeys open={disablePasskeysOpen} handleClose={() => setDisablePasskeysOpen(false)} handleDisablePasskeys={() => setDisablePasskeysOpen(false)} />
<DeleteAccount
open={deleteAccountOpen}
handleClose={() => setDeleteAccountOpen(false)}
/>
<Disable2FA
open={disable2FAOpen}
handleClose={() => setDisable2FAOpen(false)}
handleDisable2FA={() => setTwoFactorEnabled(false)}
/>
<UpdateSubscription
open={updateSubscriptionOpen}
onClose={() => setUpdateSubscriptionOpen(false)}
/>
<ChangeEmail
open={changeEmailOpen}
onClose={() => setChangeEmailOpen(false)}
/>
<DisablePasskeys
open={disablePasskeysOpen}
handleClose={() => setDisablePasskeysOpen(false)}
handleDisablePasskeys={() => setDisablePasskeysOpen(false)}
/>
</Grid>
);
};
@ -138,12 +157,20 @@ const DataTable: React.FC<DataTableProps> = ({
{title}
</Typography>
{title === "User" && (
<IconButton edge="start" aria-label="delete" onClick={onDeleteAccount}>
<IconButton
edge="start"
aria-label="delete"
onClick={onDeleteAccount}
>
<DeleteIcon style={{ color: "" }} />
</IconButton>
)}
{title === "Subscription" && (
<IconButton edge="end" aria-label="edit" onClick={onEditSubscription}>
<IconButton
edge="end"
aria-label="edit"
onClick={onEditSubscription}
>
<EditIcon style={{ color: "black", marginRight: "15px" }} />
</IconButton>
)}
@ -166,7 +193,10 @@ const DataTable: React.FC<DataTableProps> = ({
scope="row"
style={{
padding: "16px",
borderBottom: index === 1 || index === 0 ? "1px solid rgba(224, 224, 224, 1)" : "none",
borderBottom:
index === 1 || index === 0
? "1px solid rgba(224, 224, 224, 1)"
: "none",
}}
>
{label}
@ -175,10 +205,22 @@ const DataTable: React.FC<DataTableProps> = ({
align="right"
style={{
padding: "10px",
borderBottom: index === 1 || index === 0 ? "1px solid rgba(224, 224, 224, 1)" : "none",
borderBottom:
index === 1 || index === 0
? "1px solid rgba(224, 224, 224, 1)"
: "none",
}}
>
{renderTableCellContent(label, value, onEditEmail, onDisablePasskeys, twoFactorEnabled, setTwoFactorEnabled, setDisable2FAOpen)}
{/* eslint-disable-next-line @typescript-eslint/no-unsafe-assignment */}
{renderTableCellContent(
label,
value,
onEditEmail,
onDisablePasskeys,
twoFactorEnabled,
setTwoFactorEnabled,
setDisable2FAOpen,
)}
</TableCell>
</TableRow>
))}
@ -199,9 +241,19 @@ const renderTableCellContent = (
switch (label) {
case "Email":
return (
<Box sx={{ display: "flex", alignItems: "center", justifyContent: "flex-end" }}>
<Box
sx={{
display: "flex",
alignItems: "center",
justifyContent: "flex-end",
}}
>
<Typography>{value}</Typography>
<IconButton edge="end" aria-label="edit-email" onClick={onEditEmail}>
<IconButton
edge="end"
aria-label="edit-email"
onClick={onEditEmail}
>
<EditIcon style={{ color: "black" }} />
</IconButton>
</Box>
@ -212,11 +264,21 @@ const renderTableCellContent = (
Remove Passkey
</Button>
) : (
<Typography sx={{ width: "100%", paddingLeft: "1px" }}>{value}</Typography>
<Typography sx={{ width: "100%", paddingLeft: "1px" }}>
{value}
</Typography>
);
case "Two factor 2FA":
return (
<Box sx={{ display: "flex", alignItems: "center", justifyContent: "right", width: "100%", paddingRight: "50px" }}>
<Box
sx={{
display: "flex",
alignItems: "center",
justifyContent: "right",
width: "100%",
paddingRight: "50px",
}}
>
<Typography sx={{ marginRight: "1px" }}>{value}</Typography>
{value === "Enabled" && (
<Switch
@ -232,12 +294,14 @@ const renderTableCellContent = (
"& .MuiSwitch-switchBase.Mui-checked": {
color: "#00B33C",
"&:hover": {
backgroundColor: "rgba(0, 179, 60, 0.08)",
backgroundColor:
"rgba(0, 179, 60, 0.08)",
},
},
"& .MuiSwitch-switchBase.Mui-checked + .MuiSwitch-track": {
backgroundColor: "#00B33C",
},
"& .MuiSwitch-switchBase.Mui-checked + .MuiSwitch-track":
{
backgroundColor: "#00B33C",
},
}}
/>
)}
@ -248,4 +312,4 @@ const renderTableCellContent = (
}
};
export default UserComponent;
export default UserComponent;