feat: Add ability to remove team logo/profile picture

app/scenes/Settings/components/ImageInput.tsx

@@ -3,6 +3,7 @@ import { useTranslation } from "react-i18next";
 import styled from "styled-components";
 import { s } from "@shared/styles";
 import Avatar, { AvatarSize, IAvatar } from "~/components/Avatar/Avatar";
+import Button from "~/components/Button";
 import Flex from "~/components/Flex";
 import ImageUpload, { Props as ImageUploadProps } from "./ImageUpload";
 
@@ -10,24 +11,31 @@ type Props = ImageUploadProps & {
   model: IAvatar;
 };
 
-export default function ImageInput({ model, ...rest }: Props) {
+export default function ImageInput({ model, onSuccess, ...rest }: Props) {
   const { t } = useTranslation();
 
   return (
-    <ImageBox>
-      <ImageUpload {...rest}>
-        <StyledAvatar model={model} size={AvatarSize.XXLarge} />
-        <Flex auto align="center" justify="center" className="upload">
-          {t("Upload")}
-        </Flex>
-      </ImageUpload>
-    </ImageBox>
+    <Flex gap={8} justify="space-between">
+      <ImageBox>
+        <ImageUpload onSuccess={onSuccess} {...rest}>
+          <StyledAvatar model={model} size={AvatarSize.XXLarge} />
+          <Flex auto align="center" justify="center" className="upload">
+            {t("Upload")}
+          </Flex>
+        </ImageUpload>
+      </ImageBox>
+      {model.avatarUrl && (
+        <Button onClick={() => onSuccess(null)} neutral>
+          {t("Remove")}
+        </Button>
+      )}
+    </Flex>
   );
 }
 
 const avatarStyles = `
-  width: 64px;
-  height: 64px;
+  width: ${AvatarSize.XXLarge}px;
+  height: ${AvatarSize.XXLarge}px;
 `;
 
 const StyledAvatar = styled(Avatar)`