Upload Workspace logo during onboarding (#542)

* Upload image

* Upload image

* Fix tests

* Remove pictures from seeds

* Fix storybook

* Fix storybook

* Fix storybook

front/src/modules/settings/profile/components/ProfilePictureUploader.tsx

@@ -0,0 +1,47 @@
+import { getOperationName } from '@apollo/client/utilities';
+import { useRecoilState } from 'recoil';
+
+import { currentUserState } from '@/auth/states/currentUserState';
+import { ImageInput } from '@/ui/components/inputs/ImageInput';
+import { GET_CURRENT_USER } from '@/users/queries';
+import { getImageAbsoluteURI } from '@/users/utils/getProfilePictureAbsoluteURI';
+import {
+  useRemoveProfilePictureMutation,
+  useUploadProfilePictureMutation,
+} from '~/generated/graphql';
+
+export function ProfilePictureUploader() {
+  const [uploadPicture] = useUploadProfilePictureMutation();
+  const [removePicture] = useRemoveProfilePictureMutation();
+  const [currentUser] = useRecoilState(currentUserState);
+  async function onUpload(file: File) {
+    if (!file) {
+      return;
+    }
+    await uploadPicture({
+      variables: {
+        file,
+      },
+      refetchQueries: [getOperationName(GET_CURRENT_USER) ?? ''],
+    });
+  }
+
+  async function onRemove() {
+    await removePicture({
+      variables: {
+        where: {
+          id: currentUser?.id,
+        },
+      },
+      refetchQueries: [getOperationName(GET_CURRENT_USER) ?? ''],
+    });
+  }
+
+  return (
+    <ImageInput
+      picture={getImageAbsoluteURI(currentUser?.avatarUrl)}
+      onUpload={onUpload}
+      onRemove={onRemove}
+    />
+  );
+}