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

Jump to bottom

Add Profile Pic Removal Button #340

Merged
merged 13 commits into from
Sep 6, 2024
Merged

Add Profile Pic Removal Button #340

Changes from 1 commit
Commits
Show all changes
13 commits
Select commit Hold shift + click to select a range
1f22500
remove pfp button poc
solderq35 Aug 28, 2024
644560f
switch to modal
solderq35 Aug 31, 2024
d482519
remove dialog comment
solderq35 Aug 31, 2024
29db522
fix modal content text
solderq35 Aug 31, 2024
626579d
Merge branch 'main' into solderq35/remove-pfp-button
FrankreedX Aug 31, 2024
36618ff
changed back to dialog, minor wording update
FrankreedX Aug 31, 2024
7c2f9ed
remove unused styles
solderq35 Sep 1, 2024
e0037e6
commit what's working so far before removing unused styling etc
solderq35 Sep 3, 2024
daaee0e
remove some unused stuff
solderq35 Sep 3, 2024
d485d30
remove unused fragment
solderq35 Sep 3, 2024
f5d4f3a
remove more console logs and unused code
solderq35 Sep 3, 2024
969369d
slight improvement
FrankreedX Sep 3, 2024
9321d5f
nit
FrankreedX Sep 3, 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
72 changes: 57 additions & 15 deletions app/content/profile/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -28,6 +28,7 @@
import { getErrorString, getPfpName } from "~/Utility";
import ProfilePicture from "~/components/ProfilePicture";
import BottomSheetWrapper from "~/components/bottomSheetWrapper";
import DialogComponent from "~/components/dialog";
import DrillList from "~/components/drillList";
import EmptyScreen from "~/components/emptyScreen";
import ErrorComponent from "~/components/errorComponent";
Expand Down Expand Up @@ -85,6 +86,10 @@
const [newPassword, setNewPassword] = useState("");
const [newPasswordCheck, setNewPasswordCheck] = useState("");
const [passwordInputVisible, setPasswordInputVisible] = useState(false);
const [uploadLoading, setUploadLoading] = useState(false);
const [removeLoading, setRemoveLoading] = useState(false);
const [uploadDialogVisible, setUploadDialogVisible] = useState(false);
const hideUploadDialog = () => setUploadDialogVisible(false);

const [imageUploading, setImageUploading] = useState(false);

Expand All @@ -97,7 +102,7 @@
setEmail(userEmail);
}, [userData, userEmail]);

const handleUpdate = useCallback(

Check warning on line 105 in app/content/profile/index.js

View workflow job for this annotation

GitHub Actions / prettier-check 

React Hook useCallback received a function whose dependencies are unknown. Pass an inline function instead
debounce(
async () => {
setUpdateLoading(true);
Expand Down Expand Up @@ -300,6 +305,55 @@

return (
<BottomSheetModalProvider>
<DialogComponent
title={"Edit Profile Pic"}
content={"Upload New Pic, or Remove Current Pic"}
solderq35 marked this conversation as resolved.
Show resolved Hide resolved
visible={uploadDialogVisible}
onHide={hideUploadDialog}
buttons={[
{
children: "Remove ",
pressHandler: async () => {
setRemoveLoading(true);
try {
await updateDoc(userRef, {
solderq35 marked this conversation as resolved.
Show resolved Hide resolved
pfp: "",
});
await invalidateMultipleKeys(queryClient, [["userInfo"]]);
} catch (e) {
console.log(e);
showDialog("Error", getErrorString(e));
}
setRemoveLoading(false);
hideUploadDialog();
},
loading: removeLoading,
},
{
children: "Upload",
solderq35 marked this conversation as resolved.
Show resolved Hide resolved
pressHandler: async () => {
setUploadLoading(true);
try {
await handleImageUpload(
setImageUploading,
showSnackBar,
getPfpName(currentTeamId, userId),
userRef,
profilePicSize,
profilePicSize,
);
await invalidateMultipleKeys(queryClient, [["userInfo"]]);
} catch (e) {
console.log(e);
showDialog("Error", getErrorString(e));
}
setUploadLoading(false);
hideUploadDialog();
},
loading: uploadLoading,
},
]}
/>
<SafeAreaView style={{ flex: 1 }} edges={["right", "top", "left"]}>
<Header
title={"Personal Profile"}
Expand Down Expand Up @@ -328,21 +382,9 @@
<View style={styles.modalContent}>
{/* Profile Picture */}
<TouchableOpacity
onPress={async () => {
try {
await handleImageUpload(
setImageUploading,
showSnackBar,
getPfpName(currentTeamId, userId),
userRef,
profilePicSize,
profilePicSize,
);
await invalidateMultipleKeys(queryClient, [["userInfo"]]);
} catch (e) {
console.log(e);
showDialog("Error", getErrorString(e));
}
onPress={() => {
console.log("PFP Upload Pressed!");
setUploadDialogVisible(true);
}}
>
<View style={styles.profilePictureContainer}>
Expand Down
Loading