Skip to content

Commit

Permalink
wip: decrypt conversion data
Browse files Browse the repository at this point in the history
  • Loading branch information
IanKrieger committed Sep 13, 2023
1 parent d8832e6 commit 5acef9a
Show file tree
Hide file tree
Showing 7 changed files with 288 additions and 153 deletions.
22 changes: 19 additions & 3 deletions package-lock.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

2 changes: 2 additions & 0 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -27,6 +27,7 @@
"lodash": "4.17.21",
"moment": "2.29.4",
"npm-audit-resolver": "3.0.0-RC.0",
"papaparse": "5.4.1",
"react": "18.2.0",
"react-dom": "18.2.0",
"react-router-dom": "5.3.4",
Expand Down Expand Up @@ -61,6 +62,7 @@
"@types/jest": "29.5.4",
"@types/jwt-decode": "2.2.1",
"@types/lodash": "4.14.197",
"@types/papaparse": "^5.3.8",
"@types/react": "18.2.21",
"@types/react-dom": "18.2.7",
"@types/react-router-dom": "5.3.3",
Expand Down
98 changes: 2 additions & 96 deletions src/user/analytics/analyticsOverview/components/ReportUtils.tsx
Original file line number Diff line number Diff line change
@@ -1,21 +1,9 @@
import {
Alert,
Box,
Button,
ListItemIcon,
Menu,
MenuItem,
Snackbar,
} from "@mui/material";
import { Box } from "@mui/material";
import { DateRangePicker } from "components/Date/DateRangePicker";
import { DashboardButton } from "components/Button/DashboardButton";
import { CampaignFormat } from "graphql/types";
import _ from "lodash";
import { useDownloadCSV } from "user/analytics/analyticsOverview/lib/csv.library";
import { useEffect, useState } from "react";
import KeyboardArrowDownIcon from "@mui/icons-material/KeyboardArrowDown";
import KeyboardArrowUpIcon from "@mui/icons-material/KeyboardArrowUp";
import DownloadIcon from "@mui/icons-material/Download";
import { ReportMenu } from "user/reporting/ReportMenu";

interface DownloaderProps {
startDate: Date | undefined;
Expand Down Expand Up @@ -79,85 +67,3 @@ export default function ReportUtils({
</Box>
);
}

interface ReportMenuProps {
hasVerifiedConversions: boolean;
campaignId: string;
}
const ReportMenu = ({
campaignId,
hasVerifiedConversions,
}: ReportMenuProps) => {
const [isError, setIsError] = useState(false);
const { download, loading, error } = useDownloadCSV({
onComplete() {
setAnchorEl(null);
},
});
const [anchorEl, setAnchorEl] = useState<null | HTMLElement>(null);
const menu = Boolean(anchorEl);

useEffect(() => {
if (error !== undefined) {
setIsError(true);
}
}, [error]);

return (
<>
<Button
variant="contained"
onClick={(e) => setAnchorEl(e.currentTarget)}
endIcon={
anchorEl === null ? (
<KeyboardArrowDownIcon />
) : (
<KeyboardArrowUpIcon />
)
}
disabled={loading}
>
Download Report
</Button>

<Menu anchorEl={anchorEl} open={menu} onClose={() => setAnchorEl(null)}>
<MenuItem
onClick={() => download(campaignId, false)}
disabled={loading}
>
<ListItemIcon>
<DownloadIcon />
</ListItemIcon>
Performance Report
</MenuItem>
,
{hasVerifiedConversions && (
<MenuItem
onClick={() => download(campaignId, true)}
disabled={loading}
>
<ListItemIcon>
<DownloadIcon />
</ListItemIcon>
Verified Conversions Report
</MenuItem>
)}
</Menu>

<Snackbar
open={isError}
autoHideDuration={6000}
onClose={() => setIsError(false)}
anchorOrigin={{ vertical: "top", horizontal: "center" }}
>
<Alert
onClose={() => setIsError(false)}
severity="error"
sx={{ width: "100%" }}
>
{error}
</Alert>
</Snackbar>
</>
);
};
53 changes: 0 additions & 53 deletions src/user/analytics/analyticsOverview/lib/csv.library.tsx

This file was deleted.

142 changes: 142 additions & 0 deletions src/user/reporting/ReportMenu.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,142 @@
import { useState } from "react";
import { useDownloadCSV } from "user/reporting/csv.library";
import {
Alert,
Button,
Dialog,
DialogActions,
DialogContent,
DialogContentText,
DialogTitle,
LinearProgress,
ListItemIcon,
Menu,
MenuItem,
Snackbar,
TextField,
} from "@mui/material";
import KeyboardArrowDownIcon from "@mui/icons-material/KeyboardArrowDown";
import KeyboardArrowUpIcon from "@mui/icons-material/KeyboardArrowUp";
import DownloadIcon from "@mui/icons-material/Download";

interface ReportMenuProps {
hasVerifiedConversions: boolean;
campaignId: string;
}
export const ReportMenu = ({
campaignId,
hasVerifiedConversions,
}: ReportMenuProps) => {
const [privateKey, setPrivateKey] = useState<string>();
const [dialogue, setDialogue] = useState(false);
const [isError, setIsError] = useState(false);
const { download, loading, error } = useDownloadCSV({
onComplete() {
setAnchorEl(null);
setDialogue(false);
setPrivateKey(undefined);
},
onError() {
setIsError(true);
setDialogue(false);
setPrivateKey(undefined);
},
});

const [anchorEl, setAnchorEl] = useState<null | HTMLElement>(null);
const menu = Boolean(anchorEl);
return (
<>
<Button
variant="contained"
onClick={(e) => setAnchorEl(e.currentTarget)}
endIcon={
anchorEl === null ? (
<KeyboardArrowDownIcon />
) : (
<KeyboardArrowUpIcon />
)
}
disabled={loading}
>
Download Report
</Button>

<Menu anchorEl={anchorEl} open={menu} onClose={() => setAnchorEl(null)}>
<MenuItem
onClick={() => download(campaignId, false)}
disabled={loading}
>
<ListItemIcon>
<DownloadIcon />
</ListItemIcon>
Performance Report
</MenuItem>
,
{hasVerifiedConversions && (
<MenuItem onClick={() => setDialogue(true)} disabled={loading}>
<ListItemIcon>
<DownloadIcon />
</ListItemIcon>
Verified Conversions Report
</MenuItem>
)}
</Menu>

<Snackbar
open={isError}
autoHideDuration={6000}
onClose={() => setIsError(false)}
anchorOrigin={{ vertical: "top", horizontal: "center" }}
>
<Alert
onClose={() => setIsError(false)}
severity="error"
sx={{ width: "100%" }}
>
{error}
</Alert>
</Snackbar>

<Dialog open={dialogue} onClose={() => setDialogue(false)}>
<DialogTitle>Decrypt Conversion Data?</DialogTitle>
<DialogContent>
<DialogContentText>
To protect user&rsquo;s privacy, verified Ad conversion data is
encrypted so that the identities of converted users remain anonymous
to Brave. You can decrypt the conversion data in the CSV file by
providing your private key here. If no key is provided, you will
receive the encrypted conversion data. Your private key will never
be sent to or stored on any Brave servers.
</DialogContentText>
<TextField
autoFocus
onChange={(e) => setPrivateKey(e.target.value)}
margin="normal"
value={privateKey}
label="Private key"
fullWidth
variant="standard"
/>
{loading && <LinearProgress />}
</DialogContent>
<DialogActions>
<Button
variant="outlined"
onClick={() => setDialogue(false)}
disabled={loading}
>
Cancel
</Button>
<Button
variant="contained"
onClick={() => download(campaignId, true, privateKey)}
disabled={loading}
>
Export
</Button>
</DialogActions>
</Dialog>
</>
);
};
Loading

0 comments on commit 5acef9a

Please sign in to comment.