Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix: [M3-8905] - Change document title from address to appropriate keyword #11385

Merged
merged 5 commits into from
Dec 18, 2024
Merged

fix: [M3-8905] - Change document title from address to appropriate keyword #11385

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
1c7f9d4
fix: [M3-8905] - Change document title from address to appropriate ke…
hasyed-akamai Dec 9, 2024
c5c96af
Added changeset: Document title from URL to appropriate keyword
hasyed-akamai Dec 9, 2024
b5ed848
Make Document title more descriptive
hasyed-akamai Dec 10, 2024
96c13ac
resolve small regression
hasyed-akamai Dec 10, 2024
3f10e0f
Change some more document title from address to appropriate keyword
hasyed-akamai Dec 11, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
5 changes: 5 additions & 0 deletions packages/manager/.changeset/pr-11385-fixed-1733735480951.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
---
"@linode/manager": Fixed
---

Document title from URL to appropriate keyword ([#11385](https://github.com/linode/manager/pull/11385))
269 changes: 137 additions & 132 deletions packages/manager/src/features/Billing/InvoiceDetail/InvoiceDetail.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,7 @@ import * as React from 'react';
import { useParams } from 'react-router-dom';

import { Currency } from 'src/components/Currency';
import { DocumentTitleSegment } from 'src/components/DocumentTitle';
import { DownloadCSV } from 'src/components/DownloadCSV/DownloadCSV';
import { LandingHeader } from 'src/components/LandingHeader';
import { Link } from 'src/components/Link';
Expand Down Expand Up @@ -117,152 +118,156 @@ export const InvoiceDetail = () => {
};

return (
<Paper
sx={{
padding: `${theme.spacing(2)} ${theme.spacing(3)}`,
}}
>
<Grid container rowGap={2}>
<Grid xs={12}>
<Grid container data-qa-invoice-header spacing={2} sx={sxGrid}>
<Grid sm={4} sx={sxGrid} xs={12}>
<Link
accessibleAriaLabel="Back to Billing"
data-qa-back-to-billing
to={`/account/billing`}
>
<IconButton
sx={{
padding: 0,
}}
component="span"
disableFocusRipple
role="none"
size="large"
tabIndex={-1}
<>
<DocumentTitleSegment segment="Invoice | Account & Billing" />
<Paper
sx={{
padding: `${theme.spacing(2)} ${theme.spacing(3)}`,
}}
>
<Grid container rowGap={2}>
<Grid xs={12}>
<Grid container data-qa-invoice-header spacing={2} sx={sxGrid}>
<Grid sm={4} sx={sxGrid} xs={12}>
<Link
accessibleAriaLabel="Back to Billing"
data-qa-back-to-billing
to={`/account/billing`}
>
<KeyboardArrowLeft
<IconButton
sx={{
height: 34,
width: 34,
padding: 0,
}}
component="span"
disableFocusRipple
role="none"
size="large"
tabIndex={-1}
>
<KeyboardArrowLeft
sx={{
height: 34,
width: 34,
}}
/>
</IconButton>
</Link>
{invoice && (
<LandingHeader
breadcrumbProps={{
crumbOverrides: [{ label: 'Billing Info', position: 1 }],
firstAndLastOnly: true,
labelTitle: `Invoice #${invoice.id}`,
pathname: location.pathname,
}}
/>
</IconButton>
</Link>
{invoice && (
<LandingHeader
breadcrumbProps={{
crumbOverrides: [{ label: 'Billing Info', position: 1 }],
firstAndLastOnly: true,
labelTitle: `Invoice #${invoice.id}`,
pathname: location.pathname,
}}
/>
)}
)}
</Grid>
<Grid
data-qa-printable-invoice
sm
sx={{ ...sxGrid, justifyContent: 'flex-end' }}
>
{account && invoice && items && (
<>
<DownloadCSV
csvRef={csvRef}
data={items}
filename={`invoice-${invoice.date}.csv`}
headers={csvHeaders}
onClick={() => csvRef.current.link.click()}
sx={{ ...sxDownloadButton, marginRight: '8px' }}
/>
<Button
buttonType="secondary"
onClick={() => printInvoicePDF(account, invoice, items)}
sx={sxDownloadButton}
>
Download PDF
</Button>
</>
)}
</Grid>
<Grid sm="auto">
{invoice && (
<Typography data-qa-total={invoice.total} variant="h2">
Total:{' '}
<Currency
quantity={invoice.total}
wrapInParentheses={invoice.total < 0}
/>
</Typography>
)}
</Grid>
</Grid>
<Grid
data-qa-printable-invoice
sm
sx={{ ...sxGrid, justifyContent: 'flex-end' }}
>
{account && invoice && items && (
<>
<DownloadCSV
csvRef={csvRef}
data={items}
filename={`invoice-${invoice.date}.csv`}
headers={csvHeaders}
onClick={() => csvRef.current.link.click()}
sx={{ ...sxDownloadButton, marginRight: '8px' }}
</Grid>
<Grid xs={12}>
{pdfGenerationError && (
<Notice variant="error">Failed generating PDF.</Notice>
)}
<InvoiceTable
errors={errors}
items={items}
loading={loading}
shouldShowRegion={shouldShowRegion}
/>
</Grid>
<Grid xs={12}>
{invoice && (
<Box
sx={{
alignItems: 'flex-end',
display: 'flex',
flexDirection: 'column',
gap: theme.spacing(2),
padding: theme.spacing(1),
}}
data-qa-invoice-summary
>
<Typography variant="h2">
Subtotal:{' '}
<Currency
quantity={invoice.subtotal}
wrapInParentheses={invoice.subtotal < 0}
/>
<Button
buttonType="secondary"
onClick={() => printInvoicePDF(account, invoice, items)}
sx={sxDownloadButton}
>
Download PDF
</Button>
</>
)}
</Grid>
<Grid sm="auto">
{invoice && (
<Typography data-qa-total={invoice.total} variant="h2">
</Typography>
{invoice.tax_summary.map((summary) => {
return (
<Typography key={summary.name} variant="h2">
{summary.name === 'Standard'
? 'Standard Tax: '
: `${summary.name}: `}
<Currency quantity={summary.tax} />
</Typography>
);
})}
<Typography variant="h2">
Tax Subtotal: <Currency quantity={invoice.tax} />
</Typography>
<Typography variant="h2">
Total:{' '}
<Currency
quantity={invoice.total}
wrapInParentheses={invoice.total < 0}
/>
</Typography>
)}
</Grid>
<Typography>
This invoice may include Linode Compute Instances that have
been powered off as the data is maintained and resources are
still reserved. If you no longer need powered-down Linodes,
you can{' '}
<Link to="https://techdocs.akamai.com/cloud-computing/docs/stop-further-billing">
{' '}
remove the service
</Link>{' '}
from your account.
</Typography>
</Box>
)}
</Grid>
</Grid>
<Grid xs={12}>
{pdfGenerationError && (
<Notice variant="error">Failed generating PDF.</Notice>
)}
<InvoiceTable
errors={errors}
items={items}
loading={loading}
shouldShowRegion={shouldShowRegion}
/>
</Grid>
<Grid xs={12}>
{invoice && (
<Box
sx={{
alignItems: 'flex-end',
display: 'flex',
flexDirection: 'column',
gap: theme.spacing(2),
padding: theme.spacing(1),
}}
data-qa-invoice-summary
>
<Typography variant="h2">
Subtotal:{' '}
<Currency
quantity={invoice.subtotal}
wrapInParentheses={invoice.subtotal < 0}
/>
</Typography>
{invoice.tax_summary.map((summary) => {
return (
<Typography key={summary.name} variant="h2">
{summary.name === 'Standard'
? 'Standard Tax: '
: `${summary.name}: `}
<Currency quantity={summary.tax} />
</Typography>
);
})}
<Typography variant="h2">
Tax Subtotal: <Currency quantity={invoice.tax} />
</Typography>
<Typography variant="h2">
Total:{' '}
<Currency
quantity={invoice.total}
wrapInParentheses={invoice.total < 0}
/>
</Typography>
<Typography>
This invoice may include Linode Compute Instances that have been
powered off as the data is maintained and resources are still
reserved. If you no longer need powered-down Linodes, you can{' '}
<Link to="https://techdocs.akamai.com/cloud-computing/docs/stop-further-billing">
{' '}
remove the service
</Link>{' '}
from your account.
</Typography>
</Box>
)}
</Grid>
</Grid>
</Paper>
</Paper>
</>
);
};

Expand Down
6 changes: 5 additions & 1 deletion packages/manager/src/features/Databases/DatabaseDetail/index.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -165,7 +165,11 @@ export const DatabaseDetail = () => {

return (
<>
<DocumentTitleSegment segment={database.label} />
<DocumentTitleSegment
segment={`${database?.label} - ${
tabs[getTabIndex()]?.title ?? 'Detail View'
}`}
/>
<LandingHeader
breadcrumbProps={{
crumbOverrides: [
Expand Down
1 change: 1 addition & 0 deletions packages/manager/src/features/Domains/DomainsLanding.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -189,6 +189,7 @@ export const DomainsLanding = (props: DomainsLandingProps) => {
if (domains?.results === 0) {
return (
<>
<DocumentTitleSegment segment="Domains" />
<DomainsEmptyLandingState
navigateToCreate={navigateToCreate}
openImportZoneDrawer={openImportZoneDrawer}
Expand Down
4 changes: 3 additions & 1 deletion packages/manager/src/features/Kubernetes/KubernetesClusterDetail/KubernetesClusterDetail.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -78,7 +78,9 @@ export const KubernetesClusterDetail = () => {

return (
<Box>
<DocumentTitleSegment segment={`Kubernetes Cluster ${cluster?.label}`} />
<DocumentTitleSegment
segment={`${cluster?.label} | Kubernetes Cluster`}
/>
<UpgradeKubernetesVersionBanner
clusterID={cluster?.id}
clusterLabel={cluster?.label}
Expand Down
3 changes: 2 additions & 1 deletion packages/manager/src/features/ObjectStorage/BucketDetail/BucketDetail.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -10,6 +10,7 @@ import { debounce } from 'throttle-debounce';

import { ActionsPanel } from 'src/components/ActionsPanel/ActionsPanel';
import { ConfirmationDialog } from 'src/components/ConfirmationDialog/ConfirmationDialog';
import { DocumentTitleSegment } from 'src/components/DocumentTitle';
import { Hidden } from 'src/components/Hidden';
import { Table } from 'src/components/Table';
import { TableBody } from 'src/components/TableBody';
Expand Down Expand Up @@ -378,6 +379,7 @@ export const BucketDetail = (props: Props) => {

return (
<>
<DocumentTitleSegment segment={`${bucketName} | Bucket`} />
<BucketBreadcrumb
bucketName={bucketName}
history={history}
Expand Down Expand Up @@ -439,7 +441,6 @@ export const BucketDetail = (props: Props) => {
</StyledTryAgainButton>
</StyledErrorFooter>
)}

{!hasNextPage && numOfDisplayedObjects >= 100 && (
<StyledFooter variant="subtitle2">
Showing all {numOfDisplayedObjects} items
Expand Down
23 changes: 15 additions & 8 deletions packages/manager/src/features/Profile/DisplaySettings/DisplaySettings.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,7 @@ import { Divider, Paper, Stack } from '@linode/ui';
import { createLazyRoute } from '@tanstack/react-router';
import React from 'react';

import { DocumentTitleSegment } from 'src/components/DocumentTitle';
import { useProfile } from 'src/queries/profile/profile';

import { AvatarForm } from './AvatarForm';
Expand All @@ -15,14 +16,20 @@ export const DisplaySettings = () => {
const isProxyUser = profile?.user_type === 'proxy';

return (
<Paper>
<Stack divider={<Divider spacingBottom={0} spacingTop={0} />} spacing={3}>
{!isProxyUser && <AvatarForm />}
<UsernameForm />
<EmailForm />
<TimezoneForm />
</Stack>
</Paper>
<>
<DocumentTitleSegment segment="Display" />
<Paper>
<Stack
divider={<Divider spacingBottom={0} spacingTop={0} />}
spacing={3}
>
{!isProxyUser && <AvatarForm />}
<UsernameForm />
<EmailForm />
<TimezoneForm />
</Stack>
</Paper>
</>
);
};

Expand Down
Loading
Loading