feat: I can upload a photo on person show page (#1103)

* I can upload a photo on person show page

Co-authored-by: v1b3m <vibenjamin6@gmail.com>
Co-authored-by: RubensRafael <rubensrafael2@live.com>
Co-authored-by: Rubens Rafael <70234898+RubensRafael@users.noreply.github.com>

* Add requested changes

Co-authored-by: v1b3m <vibenjamin6@gmail.com>
Co-authored-by: RubensRafael <rubensrafael2@live.com>
Co-authored-by: Rubens Rafael <70234898+RubensRafael@users.noreply.github.com>

---------

Co-authored-by: v1b3m <vibenjamin6@gmail.com>
Co-authored-by: RubensRafael <rubensrafael2@live.com>
Co-authored-by: Rubens Rafael <70234898+RubensRafael@users.noreply.github.com>
This commit is contained in:
gitstart-twenty
2023-08-10 02:29:10 +08:00
committed by GitHub
parent 1f4df67a89
commit b557766eb0
9 changed files with 205 additions and 11 deletions

View File

@ -1,15 +1,19 @@
import { useParams } from 'react-router-dom';
import { getOperationName } from '@apollo/client/utilities';
import { useTheme } from '@emotion/react';
import { Timeline } from '@/activities/timeline/components/Timeline';
import { PersonPropertyBox } from '@/people/components/PersonPropertyBox';
import { usePersonQuery } from '@/people/queries';
import { GET_PERSON, usePersonQuery } from '@/people/queries';
import { IconUser } from '@/ui/icon';
import { WithTopBarContainer } from '@/ui/layout/components/WithTopBarContainer';
import { ShowPageLeftContainer } from '@/ui/layout/show-page/components/ShowPageLeftContainer';
import { ShowPageRightContainer } from '@/ui/layout/show-page/components/ShowPageRightContainer';
import { ShowPageSummaryCard } from '@/ui/layout/show-page/components/ShowPageSummaryCard';
import { CommentableType } from '~/generated/graphql';
import {
CommentableType,
useUploadPersonPictureMutation,
} from '~/generated/graphql';
import { PeopleFullNameEditableField } from '../../modules/people/editable-field/components/PeopleFullNameEditableField';
import { ShowPageContainer } from '../../modules/ui/layout/components/ShowPageContainer';
@ -21,6 +25,20 @@ export function PersonShow() {
const person = data?.findUniquePerson;
const theme = useTheme();
const [uploadPicture] = useUploadPersonPictureMutation();
async function onUploadPicture(file: File) {
if (!file || !person?.id) {
return;
}
await uploadPicture({
variables: {
file,
id: person?.id,
},
refetchQueries: [getOperationName(GET_PERSON) ?? ''],
});
}
return (
<WithTopBarContainer
@ -38,6 +56,7 @@ export function PersonShow() {
renderTitleEditComponent={() =>
person ? <PeopleFullNameEditableField people={person} /> : <></>
}
onUploadPicture={onUploadPicture}
/>
{person && <PersonPropertyBox person={person} />}
</ShowPageLeftContainer>