Skip to content

Commit

Permalink
Merge pull request #1257 from brave/master
Browse files Browse the repository at this point in the history
Production Release 2024-07-17
  • Loading branch information
IanKrieger committed Jul 17, 2024
2 parents 6a8d419 + e4a1a23 commit 933af29
Show file tree
Hide file tree
Showing 24 changed files with 896 additions and 397 deletions.
2 changes: 1 addition & 1 deletion .github/workflows/deploy-to-production.yml
Original file line number Diff line number Diff line change
Expand Up @@ -18,7 +18,7 @@ jobs:
version: 9
- uses: actions/checkout@692973e3d937129bcbf40652eb9f2f61becf3332 # v4.1.7
- name: Use Node.js
uses: actions/setup-node@60edb5dd545a775178f52524783378180af0d1f8 # v4.0.2
uses: actions/setup-node@1e60f620b9541d16bece96c5465dc8ee9832be0b # v4.0.3
with:
node-version-file: ".node-version"
cache: pnpm
Expand Down
2 changes: 1 addition & 1 deletion .github/workflows/deploy-to-staging.yml
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,7 @@ jobs:
version: 9
- uses: actions/checkout@692973e3d937129bcbf40652eb9f2f61becf3332 # v4.1.7
- name: Use Node.js
uses: actions/setup-node@60edb5dd545a775178f52524783378180af0d1f8 # v4.0.2
uses: actions/setup-node@1e60f620b9541d16bece96c5465dc8ee9832be0b # v4.0.3
with:
node-version-file: ".node-version"
cache: pnpm
Expand Down
2 changes: 1 addition & 1 deletion .github/workflows/sanity-check.yml
Original file line number Diff line number Diff line change
Expand Up @@ -18,7 +18,7 @@ jobs:
version: 9
- uses: actions/checkout@692973e3d937129bcbf40652eb9f2f61becf3332 # v4.1.7
- name: Use Node.js
uses: actions/setup-node@60edb5dd545a775178f52524783378180af0d1f8 # v4.0.2
uses: actions/setup-node@1e60f620b9541d16bece96c5465dc8ee9832be0b # v4.0.3
with:
node-version-file: ".node-version"
cache: pnpm
Expand Down
2 changes: 1 addition & 1 deletion .node-version
Original file line number Diff line number Diff line change
@@ -1 +1 @@
20.15.0
20.15.1
43 changes: 22 additions & 21 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -7,26 +7,26 @@
"@apollo/client": "3.10.8",
"@emotion/react": "11.11.4",
"@emotion/styled": "11.11.5",
"@fontsource/inter": "5.0.18",
"@fontsource/inter": "5.0.19",
"@fontsource/mulish": "5.0.18",
"@fontsource/poppins": "5.0.14",
"@graphql-typed-document-node/core": "3.2.0",
"@jonkoops/matomo-tracker-react": "0.7.0",
"@lingui/conf": "4.11.1",
"@lingui/core": "4.11.1",
"@lingui/detect-locale": "4.11.1",
"@lingui/macro": "4.11.1",
"@lingui/react": "4.11.1",
"@mui/icons-material": "5.15.21",
"@mui/lab": "5.0.0-alpha.170",
"@mui/material": "5.15.21",
"@mui/x-data-grid": "7.8.0",
"@mui/x-date-pickers": "7.8.0",
"@lingui/conf": "4.11.2",
"@lingui/core": "4.11.2",
"@lingui/detect-locale": "4.11.2",
"@lingui/macro": "4.11.2",
"@lingui/react": "4.11.2",
"@mui/icons-material": "5.16.0",
"@mui/lab": "5.0.0-alpha.171",
"@mui/material": "5.16.0",
"@mui/x-data-grid": "7.9.0",
"@mui/x-date-pickers": "7.9.0",
"bignumber.js": "9.1.2",
"dayjs": "1.11.11",
"formik": "2.4.6",
"graphql": "16.9.0",
"highcharts": "11.4.3",
"highcharts": "11.4.6",
"highcharts-react-official": "3.2.1",
"immer": "10.1.1",
"lodash": "4.17.21",
Expand All @@ -36,6 +36,7 @@
"react-router-dom": "5.3.4",
"react-virtualized-auto-sizer": "1.0.24",
"react-window": "1.8.10",
"swr": "2.2.5",
"tweetnacl": "1.0.3",
"yup": "1.4.0"
},
Expand All @@ -60,11 +61,11 @@
"devDependencies": {
"@eslint/js": "8.57.0",
"@graphql-codegen/cli": "5.0.2",
"@graphql-codegen/client-preset": "4.3.1",
"@graphql-codegen/client-preset": "4.3.2",
"@graphql-codegen/introspection": "4.0.3",
"@graphql-eslint/eslint-plugin": "3.20.1",
"@lingui/cli": "4.11.1",
"@lingui/vite-plugin": "4.11.1",
"@lingui/cli": "4.11.2",
"@lingui/vite-plugin": "4.11.2",
"@parcel/watcher": "2.4.1",
"@types/lodash": "4.17.6",
"@types/papaparse": "5.3.14",
Expand All @@ -81,14 +82,14 @@
"eslint-plugin-react": "7.34.3",
"eslint-plugin-react-hooks": "4.6.2",
"husky": "9.0.11",
"knip": "5.23.2",
"knip": "5.24.2",
"lint-staged": "15.2.7",
"npm-run-all2": "6.2.0",
"npm-run-all2": "6.2.2",
"prettier": "3.3.2",
"typescript": "5.5.2",
"typescript-eslint": "7.14.1",
"vite": "5.3.2",
"vite-plugin-checker": "0.6.4",
"typescript": "5.5.3",
"typescript-eslint": "7.15.0",
"vite": "5.3.3",
"vite-plugin-checker": "0.7.1",
"vite-tsconfig-paths": "4.3.2",
"vitest": "1.6.0"
},
Expand Down
695 changes: 331 additions & 364 deletions pnpm-lock.yaml

Large diffs are not rendered by default.

2 changes: 2 additions & 0 deletions src/App.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -20,6 +20,7 @@ import { BraveAdsContactFrame } from "@/auth/registration/BraveAdsContactFrame";
import { useMatomo } from "@jonkoops/matomo-tracker-react";
import { SearchLandingPage } from "@/search/SearchLandingPage";
import { BasicAttentionTokenLandingPage } from "@/basic-attention-token/BasicAttentionTokenLandingPage";
import { SearchPreviewPage } from "./search/preview/SearchPreviewPage";

export function App() {
const { enableLinkTracking } = useMatomo();
Expand All @@ -46,6 +47,7 @@ export function App() {
<Route path="/register" component={Register} />
<Route path="/contact" component={BraveAdsContactFrame} />
<Route path="/bat" component={BasicAttentionTokenLandingPage} />
<Route path="/search/preview/:slug" component={SearchPreviewPage} />
<Route path="/search" component={SearchLandingPage} />
<Route path="/user/main" component={User} />
<Route path="/" exact={true} component={LandingPage} />
Expand Down
6 changes: 4 additions & 2 deletions src/components/Creatives/SearchPreview.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -166,13 +166,15 @@ export function SearchPreview({ title, body, targetUrl, favicon }: Props) {
sx={{
alignItems: "center",
color: "var(--color-serp-breadcrumbs)",
display: "flex",
display: "block",
fontSize: "var(--text-sm)",
fontStyle: "normal",
lineHeight: "22px",
marginTop: searchRemToPx(-0.15),
maxWidth: "90%",
overflow: "visible",
overflow: "hidden",
whiteSpace: "nowrap",
textOverflow: "ellipsis",
}}
>
<SearchUrlDisplay url={url} />
Expand Down
7 changes: 7 additions & 0 deletions src/components/Navigation/AccountMenu.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -31,6 +31,13 @@ export function AccountMenu() {
const nonCurrentAdvertisers = advertisers.filter(
(a) => a.id !== advertiser.id,
);

// the navbar can be used for non-logged in users, so just don't display
// a profile if the user is not logged in
if (!user.userId) {
return null;
}

return (
<>
<Tooltip title={<Trans>Account</Trans>} placement="bottom-start">
Expand Down
4 changes: 3 additions & 1 deletion src/components/Switch/OnOff.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -39,7 +39,9 @@ export function OnOff({
<Tooltip
title={
enabled ? (
`${tooltip} ${type}`
<>
{tooltip} {type}
</>
) : (
<Trans>{type} status cannot be updated</Trans>
)
Expand Down
56 changes: 56 additions & 0 deletions src/search/preview/CallToAction.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,56 @@
/* eslint-disable lingui/no-unlocalized-strings */
import { Box, Button, Link, Typography } from "@mui/material";

interface Props {
domain: string;
}

export function CallToAction({ domain }: Props) {
return (
<Box
marginBottom={1}
padding={2}
display="flex"
gap={1}
alignItems="center"
bgcolor="#F7F9FF"
borderRadius="12px"
>
<Box flex={1}>
<Typography variant="h2" marginBottom={2}>
Brave Search Ads Preview
</Typography>
<Typography variant="body2" marginBottom={2}>
This preview has been created for{" "}
<Link
href={`https://${domain}/`}
target="_blank"
rel="noreferrer"
underline="hover"
>
{domain}
</Link>{" "}
by analyzing existing Google campaigns and matching them with keyword
volumes from Brave Search.
</Typography>
<Typography variant="body2" marginBottom={2}>
To view and manage all available ads and get started with Search Ads
from Brave, please book a meeting with an account manager.
</Typography>
</Box>

<Box minWidth="100px">
<Button
variant="contained"
color="primary"
component="a"
href="https://calendar.google.com/calendar/u/0/appointments/AcZssZ2sEAG3kPSlTKpGd48pYAa2zTd-QpI2L2ewxao="
target="_blank"
rel="noreferrer"
>
Book a Meeting
</Button>
</Box>
</Box>
);
}
106 changes: 106 additions & 0 deletions src/search/preview/LandingPageDetail.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,106 @@
/* eslint-disable lingui/no-unlocalized-strings */
import SearchIcon from "@mui/icons-material/Search";
import { Box, Chip, IconButton, Popover, Typography } from "@mui/material";
import { useState } from "react";
import { LandingPageInfo, useKeywordData } from "./data";
import dayjs from "dayjs";
import { SkeletonQueryList } from "@/user/views/user/search/LandingPageDetail";

function QueryList({ queries }: { queries: string[] }) {
const [visibleQueryCount, setVisibleQueryCount] = useState(20);

const numQueries = queries.length;
const hasMore = numQueries > visibleQueryCount;

const queriesToShow = queries.slice(0, visibleQueryCount);

return (
<>
{queriesToShow.map((q) => (
<Chip key={q} label={q} size="small" />
))}

{hasMore && (
<Chip
size="small"
variant="outlined"
color="primary"
label={`more`}
onClick={() => setVisibleQueryCount((c) => c + 50)}
/>
)}
</>
);
}

interface Props {
landingPage: LandingPageInfo;
}

export function LandingPageDetail({ landingPage }: Props) {
const [anchorEl, setAnchorEl] = useState<HTMLButtonElement | null>(null);

const handleClick = (event: React.MouseEvent<HTMLButtonElement>) => {
setAnchorEl(event.currentTarget);
};

const handleClose = () => {
setAnchorEl(null);
};

const open = Boolean(anchorEl);

return (
<div>
<IconButton edge="end" aria-label="details" onClick={handleClick}>
<SearchIcon />
</IconButton>
<Popover
open={open}
anchorEl={anchorEl}
onClose={handleClose}
anchorOrigin={{
vertical: "bottom",
horizontal: "right",
}}
sx={{
minHeight: 200,
}}
>
<LandingPageDetailContent landingPage={landingPage} />
</Popover>
</div>
);
}

function LandingPageDetailContent({
landingPage,
}: {
landingPage: LandingPageInfo;
}) {
const { data: queries } = useKeywordData(landingPage.slug, landingPage.url);

return (
<Box sx={{ padding: 2, width: 600, height: 300 }}>
<Typography variant="h2" gutterBottom>
Full Landing Page URL
</Typography>

<Typography gutterBottom fontFamily="monospace" fontSize="small">
{landingPage.url}
</Typography>

<Typography variant="caption" gutterBottom>
Last seen {dayjs(landingPage.lastSeen).fromNow()}
</Typography>

<Typography variant="h2" marginTop={2} marginBottom={1}>
Sample Queries
</Typography>

<Box display="flex" flexWrap="wrap" gap={1} marginBottom={2}>
{queries ? <QueryList queries={queries} /> : <SkeletonQueryList />}
</Box>
</Box>
);
}
55 changes: 55 additions & 0 deletions src/search/preview/LandingPageList.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,55 @@
import { LandingPageListEntry } from "./LandingPageListEntry";

import { FixedSizeList } from "react-window";
import AutoSizer from "react-virtualized-auto-sizer";
import { Basket } from "@/user/views/user/search/basket";
import { LandingPageInfo } from "./data";

interface Props {
basket: Basket;
landingPages: LandingPageInfo[];
allowSelection?: boolean;
}

export function LandingPageList({
landingPages,
basket,
allowSelection = true,
}: Props) {
return (
<AutoSizer>
{({ height, width }) => (
<FixedSizeList
height={height}
width={width}
itemSize={200}
itemCount={landingPages.length}
style={{ overflowX: "scroll" }}
>
{({ index, style }) => {
const landingPage = landingPages[index];

return (
<LandingPageListEntry
key={index}
style={style}
landingPage={landingPage}
allowSelection={allowSelection}
hasMultipleCreatives={landingPage.creatives.length > 1}
creativeIndex={basket.creativeIndexForLandingPage(
landingPage.url,
)}
nextCreative={() =>
basket.nextCreativeForLandingPage(
landingPage.url,
landingPage.creatives.length,
)
}
/>
);
}}
</FixedSizeList>
)}
</AutoSizer>
);
}
Loading

0 comments on commit 933af29

Please sign in to comment.