bigbuffet/bigbuffet-rw
2
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Properly handle navigating to previous page if 'backHref' is undefined

Browse source
This commit is contained in:
Justin 2022-03-21 15:23:57 -04:00
parent b4d677dfde
commit e02d5142e5
2 changed files with 99 additions and 93 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

22
app/soapbox/components/ui/column/column.tsx
View file

@ -1,10 +1,11 @@
import React from 'react'; import React from 'react';
import { RouteComponentProps, withRouter } from 'react-router-dom';
import Helmet from 'soapbox/components/helmet'; import Helmet from 'soapbox/components/helmet';
import { Card, CardBody, CardHeader, CardTitle } from '../card/card'; import { Card, CardBody, CardHeader, CardTitle } from '../card/card';
interface IColumn { interface IColumn extends RouteComponentProps {
backHref?: string, backHref?: string,
label?: string, label?: string,
transparent?: boolean, transparent?: boolean,
@ -12,7 +13,20 @@ interface IColumn {
} }
const Column: React.FC<IColumn> = React.forwardRef((props, ref: React.ForwardedRef<HTMLDivElement>): JSX.Element => { const Column: React.FC<IColumn> = React.forwardRef((props, ref: React.ForwardedRef<HTMLDivElement>): JSX.Element => {
const { backHref, children, label, transparent = false, withHeader = true } = props; const { backHref, children, label, history, transparent = false, withHeader = true } = props;
const handleBackClick = () => {
if (backHref) {
history.push(backHref);
return;
}
if (history.length === 1) {
history.push('/');
} else {
history.goBack();
}
};
const renderChildren = () => { const renderChildren = () => {
if (transparent) { if (transparent) {
@ -22,7 +36,7 @@ const Column: React.FC<IColumn> = React.forwardRef((props, ref: React.ForwardedR
return ( return (
<Card variant='rounded'> <Card variant='rounded'>
{withHeader ? ( {withHeader ? (
<CardHeader backHref={backHref}> <CardHeader onBackClick={handleBackClick}>
<CardTitle title={label} /> <CardTitle title={label} />
</CardHeader> </CardHeader>
) : null} ) : null}
@ -43,4 +57,4 @@ const Column: React.FC<IColumn> = React.forwardRef((props, ref: React.ForwardedR
); );
}); });
export default Column; export default withRouter(Column);

12
app/soapbox/features/edit_profile/index.js
View file

@ -22,7 +22,7 @@ import { makeGetAccount } from 'soapbox/selectors';
import { getFeatures } from 'soapbox/utils/features'; import { getFeatures } from 'soapbox/utils/features';
import resizeImage from 'soapbox/utils/resize_image'; import resizeImage from 'soapbox/utils/resize_image';
import { Button, Card, CardBody, CardHeader, CardTitle, Column, Form, FormActions, FormGroup, Input, Textarea } from '../../components/ui'; import { Button, Column, Form, FormActions, FormGroup, Input, Textarea } from '../../components/ui';
import ProfilePreview from './components/profile_preview'; import ProfilePreview from './components/profile_preview';
@ -246,13 +246,7 @@ class EditProfile extends ImmutablePureComponent {
const canEditName = verifiedCanEditName || !verified; const canEditName = verifiedCanEditName || !verified;
return ( return (
<Column label='Edit Profile' transparent withHeader={false}> <Column label='Edit Profile'>
<Card variant='rounded'>
<CardHeader backHref='/settings'>
<CardTitle title={intl.formatMessage(messages.heading)} />
</CardHeader>
<CardBody>
<Form onSubmit={this.handleSubmit}> <Form onSubmit={this.handleSubmit}>
<FormGroup <FormGroup
labelText={<FormattedMessage id='edit_profile.fields.display_name_label' defaultMessage='Display name' />} labelText={<FormattedMessage id='edit_profile.fields.display_name_label' defaultMessage='Display name' />}
@ -414,8 +408,6 @@ class EditProfile extends ImmutablePureComponent {
</Button> </Button>
</FormActions> </FormActions>
</Form> </Form>
</CardBody>
</Card>
</Column> </Column>
); );
} }