From 5af4943e6ffa007e555e1fcb1933627d6b621c58 Mon Sep 17 00:00:00 2001 From: Afonsos4ntos Date: Mon, 19 Jun 2023 16:54:41 +0100 Subject: [PATCH 01/15] fix conflict --- apps/app/components/Register/index.tsx | 1 - 1 file changed, 1 deletion(-) diff --git a/apps/app/components/Register/index.tsx b/apps/app/components/Register/index.tsx index 677d5eb9..00b1a47d 100644 --- a/apps/app/components/Register/index.tsx +++ b/apps/app/components/Register/index.tsx @@ -58,7 +58,6 @@ function Register({ cities }: any) { "Discord", "Slack", ]); - const onFinish = (values: any) => { console.log(values); setLoading(true); From 736ea9943de1a576665f319ec438e9a133e244e6 Mon Sep 17 00:00:00 2001 From: Afonsos4ntos Date: Tue, 13 Jun 2023 17:07:06 +0100 Subject: [PATCH 02/15] Run formatter --- apps/app/components/Register/index.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/apps/app/components/Register/index.tsx b/apps/app/components/Register/index.tsx index 00b1a47d..186f762d 100644 --- a/apps/app/components/Register/index.tsx +++ b/apps/app/components/Register/index.tsx @@ -59,7 +59,7 @@ function Register({ cities }: any) { "Slack", ]); const onFinish = (values: any) => { - console.log(values); + setLoading(true); api .registerUser(values) From 823d72b58a13b1bdd4a27f60df4eb901b13710c4 Mon Sep 17 00:00:00 2001 From: Afonsos4ntos Date: Wed, 14 Jun 2023 17:02:50 +0100 Subject: [PATCH 03/15] Fix imageCrop --- apps/app/components/Register/index.tsx | 52 ++++++++++++++++---------- packages/bokkenjs/lib/auth/auth.ts | 3 +- 2 files changed, 34 insertions(+), 21 deletions(-) diff --git a/apps/app/components/Register/index.tsx b/apps/app/components/Register/index.tsx index 186f762d..7159b957 100644 --- a/apps/app/components/Register/index.tsx +++ b/apps/app/components/Register/index.tsx @@ -48,7 +48,7 @@ function Register({ cities }: any) { const { user } = useAuth(); const [isLoading, setLoading] = useState(false); const [errors, setErrors] = useState(); - const [avatar, setAvatar] = useState(null); + const [avatar, setAvatar] = useState(null); const [socials] = useState([ "Scratch", "Codewars", @@ -59,7 +59,9 @@ function Register({ cities }: any) { "Slack", ]); const onFinish = (values: any) => { - + console.log(avatar); + values["user[photo]"] = avatar; + setLoading(true); api .registerUser(values) @@ -204,24 +206,34 @@ function Register({ cities }: any) { label="Foto de perfil" valuePropName="avatar" > - { - getBase64(file, (imageUrl: any) => setAvatar(imageUrl)); - return false; - }} - onRemove={() => setAvatar(null)} - multiple={false} - maxCount={1} - showUploadList={{ - showDownloadIcon: false, - showPreviewIcon: false, - showRemoveIcon: true, - }} - > - - + + { + const reader = new FileReader(); + + reader.onload = function (event) { + if (event.target) { + console.log(typeof event.target.result); + setAvatar(event.target.result); + } + }; + reader.readAsDataURL(file); + return false; + }} + //onRemove={() => setAvatar(null)} + multiple={false} + maxCount={1} + showUploadList={{ + showDownloadIcon: false, + showPreviewIcon: false, + showRemoveIcon: true, + }} + > + + + {user?.role == EUser.Mentor && ( diff --git a/packages/bokkenjs/lib/auth/auth.ts b/packages/bokkenjs/lib/auth/auth.ts index 41e28d27..6e76d208 100644 --- a/packages/bokkenjs/lib/auth/auth.ts +++ b/packages/bokkenjs/lib/auth/auth.ts @@ -103,11 +103,12 @@ export async function registerUser(values: any) { const data = new FormData(); for (const key in values) { + console.log(key, values[key]); if (!values[key]) continue; switch (key) { case "user[photo]": - data.append(key, values[key].file); + data.append(key, values[key]); break; case "user[birthday]": From 6d848055e5e0b455f723fb3817c494f710832291 Mon Sep 17 00:00:00 2001 From: Afonsos4ntos Date: Sun, 18 Jun 2023 18:11:57 +0100 Subject: [PATCH 04/15] update --- apps/app/components/Register/index.tsx | 20 ++++++-- apps/app/lib/images.js | 5 -- apps/app/lib/images.ts | 28 +++++++++++ apps/app/pages/admin/lectures/index.tsx | 49 ++++++++++++++++++++ apps/app/pages/lectures/[role]/[id].tsx | 2 +- apps/app/pages/settings.tsx | 46 +++++++++++------- packages/bokkenjs/lib/auth/auth.ts | 4 +- packages/ui/components/Auth/AuthProvider.tsx | 1 + 8 files changed, 128 insertions(+), 27 deletions(-) delete mode 100644 apps/app/lib/images.js create mode 100644 apps/app/lib/images.ts diff --git a/apps/app/components/Register/index.tsx b/apps/app/components/Register/index.tsx index 7159b957..c959d936 100644 --- a/apps/app/components/Register/index.tsx +++ b/apps/app/components/Register/index.tsx @@ -22,7 +22,7 @@ import { } from "@ant-design/icons"; import { useAuth } from "@coderdojobraga/ui"; import * as api from "bokkenjs"; -import { getBase64 } from "~/lib/images"; +import {dataURLtoFile} from "~/lib/images"; import Emoji from "~/components/Emoji"; import styles from "./style.module.css"; @@ -32,6 +32,9 @@ import { notifyError, notifyInfo } from "~/components/Notification"; import { getIcon } from "~/lib/utils"; + + + const { Option } = Select; const CountrySelect = () => ( @@ -48,7 +51,7 @@ function Register({ cities }: any) { const { user } = useAuth(); const [isLoading, setLoading] = useState(false); const [errors, setErrors] = useState(); - const [avatar, setAvatar] = useState(null); + const [avatar, setAvatar] = useState< File | null>(null); const [socials] = useState([ "Scratch", "Codewars", @@ -211,12 +214,21 @@ function Register({ cities }: any) { name="avatar" accept="image/*" beforeUpload={(file: File) => { + const reader = new FileReader(); reader.onload = function (event) { if (event.target) { - console.log(typeof event.target.result); - setAvatar(event.target.result); + + // Access the uploaded file data as a string + const imageDataURL = event.target.result as string; + + // Perform any necessary actions with the image data URL + console.log(typeof imageDataURL); + + // Convert the data URL back to a file object + const convertedFile = dataURLtoFile(imageDataURL, file.name); + setAvatar(convertedFile); } }; reader.readAsDataURL(file); diff --git a/apps/app/lib/images.js b/apps/app/lib/images.js deleted file mode 100644 index f0dac682..00000000 --- a/apps/app/lib/images.js +++ /dev/null @@ -1,5 +0,0 @@ -export function getBase64(img, callback) { - const reader = new FileReader(); - reader.addEventListener("load", () => callback(reader.result)); - reader.readAsDataURL(img); -} diff --git a/apps/app/lib/images.ts b/apps/app/lib/images.ts new file mode 100644 index 00000000..337fc37b --- /dev/null +++ b/apps/app/lib/images.ts @@ -0,0 +1,28 @@ +export function getBase64(img:File, callback:Function) { + const reader = new FileReader(); + reader.addEventListener("load", () => callback(reader.result)); + reader.readAsDataURL(img); +} + +// export function dataURLtoFile(dataURL:string, filename:string) { +// const arr = dataURL.split(','); +// const expectedMimeTypes = ['image/jpeg', 'image/png']; + + +// const match = arr[0].match(/:(.*?);/); +// if (!match) return null; + +// const mime = match[1]; + +// if (!expectedMimeTypes.includes(mime) ) return null; + +// const bstr = atob(arr[1]); +// let n = bstr.length; +// const u8arr = new Uint8Array(n); + +// while (n--) { +// u8arr[n] = bstr.charCodeAt(n); +// } + +// return new File([u8arr], filename, { type: mime }); +// } diff --git a/apps/app/pages/admin/lectures/index.tsx b/apps/app/pages/admin/lectures/index.tsx index 042fe157..b4d72108 100644 --- a/apps/app/pages/admin/lectures/index.tsx +++ b/apps/app/pages/admin/lectures/index.tsx @@ -240,6 +240,55 @@ function Lectures() { onOk={handleOk} onCancel={handleOk} > + + + + {/* const PresenceList: React.FC = ({ attendees }) => { + const [presence, setPresence] = useState(Array(attendees.length).fill(false)); + + const handlePresenceChange = (index: number) => { + const updatedPresence = [...presence]; + updatedPresence[index] = !updatedPresence[index]; + setPresence(updatedPresence); + }; + + return ( +
+ {attendees.map((attendee, index) => ( +
+ handlePresenceChange(index)} + /> + +
+ ))} +
+ ); + }; + + export default PresenceList; + */} + + + + + + + + + + + + + + + + + + + + 1 diff --git a/apps/app/pages/settings.tsx b/apps/app/pages/settings.tsx index 7bc96dd6..68df06ee 100644 --- a/apps/app/pages/settings.tsx +++ b/apps/app/pages/settings.tsx @@ -13,6 +13,7 @@ import { Typography, Upload, } from "antd"; +import ImgCrop from "antd-img-crop"; import moment from "moment"; import { MinusCircleOutlined, @@ -62,7 +63,7 @@ function Settings() { const { user, edit_user, isLoading } = useAuth(); const [formPersonal] = Form.useForm(); const [formPassword] = Form.useForm(); - const [avatar, setAvatar] = useState(); + const [avatar, setAvatar] = useState(); const [userSkills, setUserSkills] = useState([]); const [skills, setSkills] = useState([]); @@ -78,6 +79,14 @@ function Settings() { "Slack", ]); + const onSubmit = (values: any) => { + if (avatar) { + values["user[photo]"] = avatar; + } + + edit_user(values); + }; + const getAllSkills = () => { getSkills() .then((response) => setSkills(response.data)) @@ -210,9 +219,11 @@ function Settings() { }, [user?.role, user?.mentor_id, formPersonal]); useEffect(() => { - setAvatar(user?.photo); - getUserSkills(); - getAllSkills(); + if (user?.photo) { + setAvatar(user?.photo); + }; + getUserSkills(); + getAllSkills(); }, [user, getUserSkills]); const breakpoints = { @@ -252,22 +263,25 @@ function Settings() { -
+
- { - getBase64(file, (imageUrl: any) => setAvatar(imageUrl)); - return false; - }} - onRemove={() => setAvatar(user?.photo)} - > - - + + { + console.log(file); + setAvatar(file.name); + return false; + }} + onRemove={() => setAvatar(user?.photo as File | undefi)} + > + + +
diff --git a/packages/bokkenjs/lib/auth/auth.ts b/packages/bokkenjs/lib/auth/auth.ts index 6e76d208..e859201a 100644 --- a/packages/bokkenjs/lib/auth/auth.ts +++ b/packages/bokkenjs/lib/auth/auth.ts @@ -56,7 +56,7 @@ export async function editUser(values: any) { switch (key) { case "user[photo]": - data.append(key, values[key].file); + data.append(key, values[key]); break; case "user[birthday]": @@ -132,3 +132,5 @@ export async function registerUser(values: any) { return response.data; } + + diff --git a/packages/ui/components/Auth/AuthProvider.tsx b/packages/ui/components/Auth/AuthProvider.tsx index 1140a200..46b6dce4 100644 --- a/packages/ui/components/Auth/AuthProvider.tsx +++ b/packages/ui/components/Auth/AuthProvider.tsx @@ -81,6 +81,7 @@ export function AuthProvider({ children }: PropsWithChildren) { function edit_user(values: any) { setLoading(true); + console.log(values); api .editUser(values) From 469ff5873c58da64f49126748700ed9638d07bfb Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?M=C3=A1rio=20Rodrigues?= Date: Sun, 18 Jun 2023 18:38:51 +0100 Subject: [PATCH 05/15] Fix preview upload --- apps/app/pages/settings.tsx | 13 +++++++++---- 1 file changed, 9 insertions(+), 4 deletions(-) diff --git a/apps/app/pages/settings.tsx b/apps/app/pages/settings.tsx index 68df06ee..99df48f9 100644 --- a/apps/app/pages/settings.tsx +++ b/apps/app/pages/settings.tsx @@ -63,7 +63,7 @@ function Settings() { const { user, edit_user, isLoading } = useAuth(); const [formPersonal] = Form.useForm(); const [formPassword] = Form.useForm(); - const [avatar, setAvatar] = useState(); + const [avatar, setAvatar] = useState(); const [userSkills, setUserSkills] = useState([]); const [skills, setSkills] = useState([]); @@ -182,6 +182,12 @@ function Settings() { } }; + const base64 = (file: any) => { + getBase64(file, (result: string) => { + setAvatar(result); + }); + }; + const changeSkills = () => { const deleted = userSkills .map((skill: any) => skill.id) @@ -273,11 +279,10 @@ function Settings() { accept="image/*" maxCount={1} beforeUpload={(file) => { - console.log(file); - setAvatar(file.name); + base64(file); return false; }} - onRemove={() => setAvatar(user?.photo as File | undefi)} + onRemove={() => setAvatar(user?.photo)} > From 03cb6328afdcaee7b08eb42cc63e41c780c094fa Mon Sep 17 00:00:00 2001 From: Afonsos4ntos Date: Mon, 19 Jun 2023 16:11:39 +0100 Subject: [PATCH 06/15] resolve the crop issues --- apps/app/components/AppMenu/index.tsx | 16 ++++++- apps/app/components/Profile/index.tsx | 17 ++++++-- apps/app/components/Register/index.tsx | 57 +++++++++++-------------- apps/app/lib/images.ts | 41 ++++++++---------- apps/app/pages/admin/lectures/index.tsx | 23 +--------- apps/app/pages/lectures/[role]/[id].tsx | 3 +- apps/app/pages/settings.tsx | 45 +++++++++++++------ packages/bokkenjs/lib/api.ts | 2 +- packages/bokkenjs/lib/auth/auth.ts | 2 - 9 files changed, 105 insertions(+), 101 deletions(-) diff --git a/apps/app/components/AppMenu/index.tsx b/apps/app/components/AppMenu/index.tsx index 26cbd9c8..857b0481 100644 --- a/apps/app/components/AppMenu/index.tsx +++ b/apps/app/components/AppMenu/index.tsx @@ -16,7 +16,7 @@ import { UsergroupAddOutlined, } from "@ant-design/icons"; import { useAuth } from "@coderdojobraga/ui"; -import { EUser, IUser } from "bokkenjs"; +import { API_URL, EUser, IUser } from "bokkenjs"; import styles from "./style.module.css"; @@ -49,6 +49,7 @@ function AppMenu({ hidePrimaryMenu, collapsed }: any) { const [secondarySelectedKeys, setSecondarySelectedKeys] = useState( [] ); + const [avatarPreview] = useState(); const handleClickPrimary = ({ key }: { key: string }) => { router.push(key); setPrimarySelectedKeys([key]); @@ -60,6 +61,17 @@ function AppMenu({ hidePrimaryMenu, collapsed }: any) { setPrimarySelectedKeys([]); setSecondarySelectedKeys([key]); }; + let avatarSrc; + if ( + !avatarPreview && + typeof user?.photo === "string" && + user?.photo.startsWith("/uploads/") + ) { + const previewUrl = `${API_URL}${user.photo}`; + avatarSrc = previewUrl; + } else { + avatarSrc = user?.photo; + } return (
@@ -97,7 +109,7 @@ function AppMenu({ hidePrimaryMenu, collapsed }: any) { } diff --git a/apps/app/components/Profile/index.tsx b/apps/app/components/Profile/index.tsx index caa8037a..18273310 100644 --- a/apps/app/components/Profile/index.tsx +++ b/apps/app/components/Profile/index.tsx @@ -20,7 +20,7 @@ import * as api from "bokkenjs"; import * as socials from "~/lib/social"; import { notifyError, notifyInfo } from "~/components/Notification"; import styles from "./style.module.css"; -import { EUser } from "bokkenjs"; +import { API_URL, EUser } from "bokkenjs"; import { BsFileEarmarkPersonFill } from "react-icons/bs"; @@ -40,7 +40,7 @@ function Profile({ id, role }: Props) { const [projects, setProjects] = useState([]); const [skills, setSkills] = useState([]); const [date, setDate] = useState(""); - + const [avatarPreview] = useState(); useEffect(() => { api .getUserByRole({ id, role }) @@ -99,6 +99,17 @@ function Profile({ id, role }: Props) { setDate(moment(info.since).format("DD/MM/YYYY")); }, [info]); + let avatarSrc; + if ( + !avatarPreview && + typeof info?.photo === "string" && + info?.photo.startsWith("/uploads/") + ) { + const previewUrl = `${API_URL}${info.photo}`; + avatarSrc = previewUrl; + } else { + avatarSrc = info?.photo; + } return ( <> @@ -112,7 +123,7 @@ function Profile({ id, role }: Props) { xl: 200, xxl: 200, }} - src={info?.photo} + src={avatarSrc} icon={} /> diff --git a/apps/app/components/Register/index.tsx b/apps/app/components/Register/index.tsx index c959d936..7e006c6d 100644 --- a/apps/app/components/Register/index.tsx +++ b/apps/app/components/Register/index.tsx @@ -22,18 +22,17 @@ import { } from "@ant-design/icons"; import { useAuth } from "@coderdojobraga/ui"; import * as api from "bokkenjs"; -import {dataURLtoFile} from "~/lib/images"; +import { getAvatarSrc, getBase64 } from "~/lib/images"; import Emoji from "~/components/Emoji"; import styles from "./style.module.css"; import { useState } from "react"; -import { EUser } from "bokkenjs"; +import { API_URL, EUser } from "bokkenjs"; import { notifyError, notifyInfo } from "~/components/Notification"; import { getIcon } from "~/lib/utils"; - - +const [avatarPreview, setAvatarPreview] = useState(); const { Option } = Select; @@ -51,7 +50,7 @@ function Register({ cities }: any) { const { user } = useAuth(); const [isLoading, setLoading] = useState(false); const [errors, setErrors] = useState(); - const [avatar, setAvatar] = useState< File | null>(null); + const [avatar, setAvatar] = useState(); const [socials] = useState([ "Scratch", "Codewars", @@ -61,6 +60,7 @@ function Register({ cities }: any) { "Discord", "Slack", ]); + const onFinish = (values: any) => { console.log(avatar); values["user[photo]"] = avatar; @@ -82,6 +82,18 @@ function Register({ cities }: any) { .finally(() => setLoading(false)); }; + let avatarSrc; + if ( + !avatarPreview && + typeof user?.photo === "string" && + user?.photo.startsWith("/uploads/") + ) { + const previewUrl = `${API_URL}${user.photo}`; + avatarSrc = previewUrl; + } else { + avatarSrc = user?.photo; + } + return ( <> { - - const reader = new FileReader(); - - reader.onload = function (event) { - if (event.target) { - - // Access the uploaded file data as a string - const imageDataURL = event.target.result as string; - - // Perform any necessary actions with the image data URL - console.log(typeof imageDataURL); - - // Convert the data URL back to a file object - const convertedFile = dataURLtoFile(imageDataURL, file.name); - setAvatar(convertedFile); - } - }; - reader.readAsDataURL(file); + setAvatar(file); + getBase64(file, (result: string) => { + setAvatarPreview(result); + }); return false; }} - //onRemove={() => setAvatar(null)} - multiple={false} - maxCount={1} - showUploadList={{ - showDownloadIcon: false, - showPreviewIcon: false, - showRemoveIcon: true, - }} + onRemove={() => setAvatar(user?.photo)} > - + diff --git a/apps/app/lib/images.ts b/apps/app/lib/images.ts index 337fc37b..0c0c3fc4 100644 --- a/apps/app/lib/images.ts +++ b/apps/app/lib/images.ts @@ -1,28 +1,23 @@ -export function getBase64(img:File, callback:Function) { +export function getBase64(img: File, callback: Function) { const reader = new FileReader(); reader.addEventListener("load", () => callback(reader.result)); reader.readAsDataURL(img); } -// export function dataURLtoFile(dataURL:string, filename:string) { -// const arr = dataURL.split(','); -// const expectedMimeTypes = ['image/jpeg', 'image/png']; - - -// const match = arr[0].match(/:(.*?);/); -// if (!match) return null; - -// const mime = match[1]; - -// if (!expectedMimeTypes.includes(mime) ) return null; - -// const bstr = atob(arr[1]); -// let n = bstr.length; -// const u8arr = new Uint8Array(n); - -// while (n--) { -// u8arr[n] = bstr.charCodeAt(n); -// } - -// return new File([u8arr], filename, { type: mime }); -// } +export function getAvatarSrc( + avatarPreview: null | string | undefined, + userPhoto: string | undefined, + API_URL: string | undefined +): string | undefined { + if ( + typeof avatarPreview === "undefined" && + typeof userPhoto === "string" && + userPhoto.startsWith("/uploads/") + ) { + const previewUrl = `${API_URL}${userPhoto}`; + console.log("previewUrl", previewUrl); + return previewUrl; + } else { + return userPhoto; + } +} diff --git a/apps/app/pages/admin/lectures/index.tsx b/apps/app/pages/admin/lectures/index.tsx index b4d72108..0a10e8d8 100644 --- a/apps/app/pages/admin/lectures/index.tsx +++ b/apps/app/pages/admin/lectures/index.tsx @@ -240,10 +240,7 @@ function Lectures() { onOk={handleOk} onCancel={handleOk} > - - - - {/* const PresenceList: React.FC = ({ attendees }) => { + {/* const PresenceList: React.FC = ({ attendees }) => { const [presence, setPresence] = useState(Array(attendees.length).fill(false)); const handlePresenceChange = (index: number) => { @@ -271,24 +268,6 @@ function Lectures() { export default PresenceList; */} - - - - - - - - - - - - - - - - - - 1 + + 1 diff --git a/apps/app/pages/settings.tsx b/apps/app/pages/settings.tsx index 99df48f9..dc52d487 100644 --- a/apps/app/pages/settings.tsx +++ b/apps/app/pages/settings.tsx @@ -1,4 +1,5 @@ import { useCallback, useEffect, useState } from "react"; + import { Avatar, Button, @@ -16,15 +17,17 @@ import { import ImgCrop from "antd-img-crop"; import moment from "moment"; import { + ConsoleSqlOutlined, MinusCircleOutlined, PlusOutlined, UploadOutlined, } from "@ant-design/icons"; -import { getBase64 } from "~/lib/images"; +import { getAvatarSrc, getBase64 } from "~/lib/images"; import { useAuth } from "@coderdojobraga/ui"; import { notifyError, notifyInfo } from "~/components/Notification"; import { getIcon } from "~/lib/utils"; import { + API_URL, EUser, addMentorSkills, addNinjaSkills, @@ -63,7 +66,10 @@ function Settings() { const { user, edit_user, isLoading } = useAuth(); const [formPersonal] = Form.useForm(); const [formPassword] = Form.useForm(); - const [avatar, setAvatar] = useState(); + const [avatar, setAvatar] = useState(); + const [avatarPreview, setAvatarPreview] = useState< + null | string | undefined + >(); const [userSkills, setUserSkills] = useState([]); const [skills, setSkills] = useState([]); @@ -79,6 +85,20 @@ function Settings() { "Slack", ]); + // const avatarSrc = getAvatarSrc(avatarPreview, user?.photo, API_URL); + // if (avatarSrc !== avatarPreview) { + // setAvatarPreview(avatarSrc); + // } + + if ( + !avatarPreview && + typeof avatar === "string" && + avatar.startsWith("/uploads/") + ) { + console.log("avatar", API_URL + avatar); + setAvatarPreview(API_URL + avatar); + } + const onSubmit = (values: any) => { if (avatar) { values["user[photo]"] = avatar; @@ -182,12 +202,6 @@ function Settings() { } }; - const base64 = (file: any) => { - getBase64(file, (result: string) => { - setAvatar(result); - }); - }; - const changeSkills = () => { const deleted = userSkills .map((skill: any) => skill.id) @@ -227,9 +241,9 @@ function Settings() { useEffect(() => { if (user?.photo) { setAvatar(user?.photo); - }; - getUserSkills(); - getAllSkills(); + } + getUserSkills(); + getAllSkills(); }, [user, getUserSkills]); const breakpoints = { @@ -272,14 +286,17 @@ function Settings() {
- + { - base64(file); + beforeUpload={(file: File) => { + setAvatar(file); + getBase64(file, (result: string) => { + setAvatarPreview(result); + }); return false; }} onRemove={() => setAvatar(user?.photo)} diff --git a/packages/bokkenjs/lib/api.ts b/packages/bokkenjs/lib/api.ts index 73ffff01..149d2cc4 100644 --- a/packages/bokkenjs/lib/api.ts +++ b/packages/bokkenjs/lib/api.ts @@ -1,6 +1,6 @@ import axios, { AxiosInstance } from "axios"; -const API_URL = process.env.NEXT_PUBLIC_API_URL; +export const API_URL = process.env.NEXT_PUBLIC_API_URL; export const API: AxiosInstance = axios.create({ //TODO: replace this with environment diff --git a/packages/bokkenjs/lib/auth/auth.ts b/packages/bokkenjs/lib/auth/auth.ts index e859201a..294b34c8 100644 --- a/packages/bokkenjs/lib/auth/auth.ts +++ b/packages/bokkenjs/lib/auth/auth.ts @@ -132,5 +132,3 @@ export async function registerUser(values: any) { return response.data; } - - From fd7281c4afe31e131f41c77931367f11764b3632 Mon Sep 17 00:00:00 2001 From: Afonsos4ntos Date: Mon, 19 Jun 2023 17:26:14 +0100 Subject: [PATCH 07/15] fix issues --- apps/app/components/Register/index.tsx | 3 +-- apps/app/lib/images.ts | 18 ------------- apps/app/pages/admin/lectures/index.tsx | 28 -------------------- apps/app/pages/lectures/[role]/[id].tsx | 1 - apps/app/pages/settings.tsx | 3 +-- packages/bokkenjs/lib/auth/auth.ts | 1 - packages/ui/components/Auth/AuthProvider.tsx | 1 - 7 files changed, 2 insertions(+), 53 deletions(-) diff --git a/apps/app/components/Register/index.tsx b/apps/app/components/Register/index.tsx index 7e006c6d..1237e79f 100644 --- a/apps/app/components/Register/index.tsx +++ b/apps/app/components/Register/index.tsx @@ -22,7 +22,7 @@ import { } from "@ant-design/icons"; import { useAuth } from "@coderdojobraga/ui"; import * as api from "bokkenjs"; -import { getAvatarSrc, getBase64 } from "~/lib/images"; +import { getBase64 } from "~/lib/images"; import Emoji from "~/components/Emoji"; import styles from "./style.module.css"; @@ -62,7 +62,6 @@ function Register({ cities }: any) { ]); const onFinish = (values: any) => { - console.log(avatar); values["user[photo]"] = avatar; setLoading(true); diff --git a/apps/app/lib/images.ts b/apps/app/lib/images.ts index 0c0c3fc4..19168806 100644 --- a/apps/app/lib/images.ts +++ b/apps/app/lib/images.ts @@ -3,21 +3,3 @@ export function getBase64(img: File, callback: Function) { reader.addEventListener("load", () => callback(reader.result)); reader.readAsDataURL(img); } - -export function getAvatarSrc( - avatarPreview: null | string | undefined, - userPhoto: string | undefined, - API_URL: string | undefined -): string | undefined { - if ( - typeof avatarPreview === "undefined" && - typeof userPhoto === "string" && - userPhoto.startsWith("/uploads/") - ) { - const previewUrl = `${API_URL}${userPhoto}`; - console.log("previewUrl", previewUrl); - return previewUrl; - } else { - return userPhoto; - } -} diff --git a/apps/app/pages/admin/lectures/index.tsx b/apps/app/pages/admin/lectures/index.tsx index 0a10e8d8..042fe157 100644 --- a/apps/app/pages/admin/lectures/index.tsx +++ b/apps/app/pages/admin/lectures/index.tsx @@ -240,34 +240,6 @@ function Lectures() { onOk={handleOk} onCancel={handleOk} > - {/* const PresenceList: React.FC = ({ attendees }) => { - const [presence, setPresence] = useState(Array(attendees.length).fill(false)); - - const handlePresenceChange = (index: number) => { - const updatedPresence = [...presence]; - updatedPresence[index] = !updatedPresence[index]; - setPresence(updatedPresence); - }; - - return ( -
- {attendees.map((attendee, index) => ( -
- handlePresenceChange(index)} - /> - -
- ))} -
- ); - }; - - export default PresenceList; - */} - - 1 diff --git a/apps/app/pages/settings.tsx b/apps/app/pages/settings.tsx index dc52d487..6a17a652 100644 --- a/apps/app/pages/settings.tsx +++ b/apps/app/pages/settings.tsx @@ -1,5 +1,4 @@ import { useCallback, useEffect, useState } from "react"; - import { Avatar, Button, @@ -22,7 +21,7 @@ import { PlusOutlined, UploadOutlined, } from "@ant-design/icons"; -import { getAvatarSrc, getBase64 } from "~/lib/images"; +import { getBase64 } from "~/lib/images"; import { useAuth } from "@coderdojobraga/ui"; import { notifyError, notifyInfo } from "~/components/Notification"; import { getIcon } from "~/lib/utils"; diff --git a/packages/bokkenjs/lib/auth/auth.ts b/packages/bokkenjs/lib/auth/auth.ts index 294b34c8..840da1aa 100644 --- a/packages/bokkenjs/lib/auth/auth.ts +++ b/packages/bokkenjs/lib/auth/auth.ts @@ -103,7 +103,6 @@ export async function registerUser(values: any) { const data = new FormData(); for (const key in values) { - console.log(key, values[key]); if (!values[key]) continue; switch (key) { diff --git a/packages/ui/components/Auth/AuthProvider.tsx b/packages/ui/components/Auth/AuthProvider.tsx index 46b6dce4..1140a200 100644 --- a/packages/ui/components/Auth/AuthProvider.tsx +++ b/packages/ui/components/Auth/AuthProvider.tsx @@ -81,7 +81,6 @@ export function AuthProvider({ children }: PropsWithChildren) { function edit_user(values: any) { setLoading(true); - console.log(values); api .editUser(values) From 5ef78fd7190d13bb7330e8b0ad097a6c51e19bb9 Mon Sep 17 00:00:00 2001 From: Afonsos4ntos Date: Wed, 21 Jun 2023 11:15:31 +0100 Subject: [PATCH 08/15] resolve some merge conflit --- apps/app/components/LectureForm/index.js | 6 +++--- apps/app/components/Register/index.tsx | 3 +-- 2 files changed, 4 insertions(+), 5 deletions(-) diff --git a/apps/app/components/LectureForm/index.js b/apps/app/components/LectureForm/index.js index 9be1bb0d..2da146ea 100644 --- a/apps/app/components/LectureForm/index.js +++ b/apps/app/components/LectureForm/index.js @@ -54,12 +54,12 @@ export default function LectureForm({ id }) { let promise; - const fetchData = () => { + const fetchData = useCallback(() => { if (!promise) { promise = Promise.all(events.map((event) => getNinjaEvents(event.id))); } return promise; - }; + }, [events]); useEffect(() => { fetchData().then((responses) => { @@ -71,7 +71,7 @@ export default function LectureForm({ id }) { ) ); }); - }, [events]); + }, [fetchData]); const [filteredNinjas, setFilteredNinjas] = useState([]); const handleEventChange = useCallback( diff --git a/apps/app/components/Register/index.tsx b/apps/app/components/Register/index.tsx index 1237e79f..6d95b53f 100644 --- a/apps/app/components/Register/index.tsx +++ b/apps/app/components/Register/index.tsx @@ -32,8 +32,6 @@ import { notifyError, notifyInfo } from "~/components/Notification"; import { getIcon } from "~/lib/utils"; -const [avatarPreview, setAvatarPreview] = useState(); - const { Option } = Select; const CountrySelect = () => ( @@ -51,6 +49,7 @@ function Register({ cities }: any) { const [isLoading, setLoading] = useState(false); const [errors, setErrors] = useState(); const [avatar, setAvatar] = useState(); + const [avatarPreview, setAvatarPreview] = useState(); const [socials] = useState([ "Scratch", "Codewars", From e2653975f318fb943ff8634cdb1ea74e778b847a Mon Sep 17 00:00:00 2001 From: Afonsos4ntos Date: Wed, 21 Jun 2023 11:58:09 +0100 Subject: [PATCH 09/15] request changes --- apps/app/components/Profile/index.tsx | 3 +-- apps/app/components/Register/index.tsx | 3 +-- apps/app/pages/settings.tsx | 6 ------ 3 files changed, 2 insertions(+), 10 deletions(-) diff --git a/apps/app/components/Profile/index.tsx b/apps/app/components/Profile/index.tsx index 18273310..07d878d3 100644 --- a/apps/app/components/Profile/index.tsx +++ b/apps/app/components/Profile/index.tsx @@ -105,8 +105,7 @@ function Profile({ id, role }: Props) { typeof info?.photo === "string" && info?.photo.startsWith("/uploads/") ) { - const previewUrl = `${API_URL}${info.photo}`; - avatarSrc = previewUrl; + avatarSrc = `${API_URL}${info.photo}`; } else { avatarSrc = info?.photo; } diff --git a/apps/app/components/Register/index.tsx b/apps/app/components/Register/index.tsx index 6d95b53f..0a3ec834 100644 --- a/apps/app/components/Register/index.tsx +++ b/apps/app/components/Register/index.tsx @@ -86,8 +86,7 @@ function Register({ cities }: any) { typeof user?.photo === "string" && user?.photo.startsWith("/uploads/") ) { - const previewUrl = `${API_URL}${user.photo}`; - avatarSrc = previewUrl; + avatarSrc = `${API_URL}${user.photo}`; } else { avatarSrc = user?.photo; } diff --git a/apps/app/pages/settings.tsx b/apps/app/pages/settings.tsx index 6a17a652..93ecf27e 100644 --- a/apps/app/pages/settings.tsx +++ b/apps/app/pages/settings.tsx @@ -84,17 +84,11 @@ function Settings() { "Slack", ]); - // const avatarSrc = getAvatarSrc(avatarPreview, user?.photo, API_URL); - // if (avatarSrc !== avatarPreview) { - // setAvatarPreview(avatarSrc); - // } - if ( !avatarPreview && typeof avatar === "string" && avatar.startsWith("/uploads/") ) { - console.log("avatar", API_URL + avatar); setAvatarPreview(API_URL + avatar); } From 4eb1dc001b7efb13b0e59c2548a2b12ca4c4e7f1 Mon Sep 17 00:00:00 2001 From: Afonsos4ntos Date: Wed, 21 Jun 2023 14:24:46 +0100 Subject: [PATCH 10/15] request changes --- apps/app/components/AppMenu/index.tsx | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/apps/app/components/AppMenu/index.tsx b/apps/app/components/AppMenu/index.tsx index 857b0481..92ef9a51 100644 --- a/apps/app/components/AppMenu/index.tsx +++ b/apps/app/components/AppMenu/index.tsx @@ -67,8 +67,7 @@ function AppMenu({ hidePrimaryMenu, collapsed }: any) { typeof user?.photo === "string" && user?.photo.startsWith("/uploads/") ) { - const previewUrl = `${API_URL}${user.photo}`; - avatarSrc = previewUrl; + avatarSrc = `${API_URL}${user.photo}`; } else { avatarSrc = user?.photo; } From a684d666c2fcb49ea0eb0b9c5e3af57263a7c6b1 Mon Sep 17 00:00:00 2001 From: Afonsos4ntos Date: Mon, 26 Jun 2023 09:56:49 +0100 Subject: [PATCH 11/15] register imgPreview resolve --- apps/app/components/Register/index.tsx | 2 +- apps/app/pages/settings.tsx | 5 +---- 2 files changed, 2 insertions(+), 5 deletions(-) diff --git a/apps/app/components/Register/index.tsx b/apps/app/components/Register/index.tsx index 0a3ec834..b0afbcee 100644 --- a/apps/app/components/Register/index.tsx +++ b/apps/app/components/Register/index.tsx @@ -113,7 +113,7 @@ function Register({ cities }: any) { - } /> + } /> diff --git a/apps/app/pages/settings.tsx b/apps/app/pages/settings.tsx index 93ecf27e..ac817254 100644 --- a/apps/app/pages/settings.tsx +++ b/apps/app/pages/settings.tsx @@ -66,10 +66,7 @@ function Settings() { const [formPersonal] = Form.useForm(); const [formPassword] = Form.useForm(); const [avatar, setAvatar] = useState(); - const [avatarPreview, setAvatarPreview] = useState< - null | string | undefined - >(); - + const [avatarPreview, setAvatarPreview] = useState(); const [userSkills, setUserSkills] = useState([]); const [skills, setSkills] = useState([]); const [selectedSkills, setSelectedSkills] = useState([]); From 377d7105c9e1a5196e41ee0a693a030c6a956eb8 Mon Sep 17 00:00:00 2001 From: Afonso Santos Date: Wed, 6 Dec 2023 09:29:38 +0000 Subject: [PATCH 12/15] Correct react hook --- apps/app/components/LectureForm/index.js | 9 +++++---- 1 file changed, 5 insertions(+), 4 deletions(-) diff --git a/apps/app/components/LectureForm/index.js b/apps/app/components/LectureForm/index.js index 0402fe80..741227fd 100644 --- a/apps/app/components/LectureForm/index.js +++ b/apps/app/components/LectureForm/index.js @@ -20,7 +20,7 @@ export default function LectureForm({ id }) { const [selectedMentor, setSelectedMentor] = useState({}); const [selectedNinja, setSelectedNinja] = useState({}); const [selectedEvent, setSelectedEvent] = useState({}); - + const [mentors, setMentors] = useState([]); useEffect(() => { listMentors().then((response) => { @@ -52,10 +52,11 @@ export default function LectureForm({ id }) { }, []); const [ninjas, setNinjas] = useState([]); - const fetchData = useCallback(() => { - let promise; + + const fetchData = useCallback(() => { + let promise; if (!promise) { promise = Promise.all(events.map((event) => getNinjaEvents(event.id))); @@ -74,7 +75,7 @@ export default function LectureForm({ id }) { ) ); }); - }, [fetchData]); + }, [fetchData,events]); const [filteredNinjas, setFilteredNinjas] = useState([]); const handleEventChange = useCallback( From 4cf4b967971bdd895c0fcbce7fab650fb1868d25 Mon Sep 17 00:00:00 2001 From: Afonso Santos Date: Wed, 6 Dec 2023 09:36:46 +0000 Subject: [PATCH 13/15] Correct react hook --- apps/app/pages/admin/lectures/[id].js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/apps/app/pages/admin/lectures/[id].js b/apps/app/pages/admin/lectures/[id].js index 42e0c8e5..5e1941ae 100644 --- a/apps/app/pages/admin/lectures/[id].js +++ b/apps/app/pages/admin/lectures/[id].js @@ -1,6 +1,6 @@ import { withAuth } from "~/components/Auth"; import AppLayout from "~/layouts/AppLayout"; -import LectureForm from "~/components/LectureForm"; +import LectureForm from "../../../components/LectureForm"; import { useRouter } from "next/router"; function NewLecture() { From 5cb93da6a0596c47d82edcdf178eba1c99438c4f Mon Sep 17 00:00:00 2001 From: Afonso Santos Date: Wed, 6 Dec 2023 09:50:02 +0000 Subject: [PATCH 14/15] Correct react hook --- apps/app/pages/admin/lectures/[id].js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/apps/app/pages/admin/lectures/[id].js b/apps/app/pages/admin/lectures/[id].js index 5e1941ae..42e0c8e5 100644 --- a/apps/app/pages/admin/lectures/[id].js +++ b/apps/app/pages/admin/lectures/[id].js @@ -1,6 +1,6 @@ import { withAuth } from "~/components/Auth"; import AppLayout from "~/layouts/AppLayout"; -import LectureForm from "../../../components/LectureForm"; +import LectureForm from "~/components/LectureForm"; import { useRouter } from "next/router"; function NewLecture() { From 7015a67a14e0fbb5c773c288687817142e716cfa Mon Sep 17 00:00:00 2001 From: Afonso Santos Date: Wed, 6 Dec 2023 14:17:21 +0000 Subject: [PATCH 15/15] Correct compile erro --- apps/app/components/LectureForm/index.js | 390 +++++++++++------------ 1 file changed, 193 insertions(+), 197 deletions(-) diff --git a/apps/app/components/LectureForm/index.js b/apps/app/components/LectureForm/index.js index 741227fd..61db158c 100644 --- a/apps/app/components/LectureForm/index.js +++ b/apps/app/components/LectureForm/index.js @@ -20,7 +20,7 @@ export default function LectureForm({ id }) { const [selectedMentor, setSelectedMentor] = useState({}); const [selectedNinja, setSelectedNinja] = useState({}); const [selectedEvent, setSelectedEvent] = useState({}); - + const [mentors, setMentors] = useState([]); useEffect(() => { listMentors().then((response) => { @@ -53,244 +53,240 @@ export default function LectureForm({ id }) { const [ninjas, setNinjas] = useState([]); + const fetchData = useCallback(() => { + let promise; + if (!promise) { + promise = Promise.all(events.map((event) => getNinjaEvents(event.id))); + } - const fetchData = useCallback(() => { - let promise; - - if (!promise) { - promise = Promise.all(events.map((event) => getNinjaEvents(event.id))); - } - - return promise; - }, [events]); - - useEffect(() => { - fetchData().then((responses) => { - const allNinjas = responses.flatMap((response) => response.data); - setNinjas( - allNinjas.filter( - (ninja, index, self) => - index === self.findIndex((t) => t.id === ninja.id) - ) - ); - }); - }, [fetchData,events]); + return promise; + }, [events]); - const [filteredNinjas, setFilteredNinjas] = useState([]); - const handleEventChange = useCallback( - (event) => { - setSelectedEvent(event); - const filtered = ninjas.filter((ninja) => { - const lecture = lectures.find( - (lecture) => - lecture.ninja.id === ninja.id && lecture.event.id === event - ); - return !lecture; - }); - setFilteredNinjas(filtered); - }, - [ninjas, lectures] - ); + useEffect(() => { + fetchData().then((responses) => { + const allNinjas = responses.flatMap((response) => response.data); + setNinjas( + allNinjas.filter( + (ninja, index, self) => + index === self.findIndex((t) => t.id === ninja.id) + ) + ); + }); + }, [fetchData, events]); - const [filteredMentors, setFilteredMentors] = useState([]); - useEffect(() => { - const filtered = mentors.filter((mentor) => { + const [filteredNinjas, setFilteredNinjas] = useState([]); + const handleEventChange = useCallback( + (event) => { + setSelectedEvent(event); + const filtered = ninjas.filter((ninja) => { const lecture = lectures.find( (lecture) => - lecture.mentor.id === mentor.id && - lecture.event.id === selectedEvent.id + lecture.ninja.id === ninja.id && lecture.event.id === event ); return !lecture; }); - setFilteredMentors(filtered); - }, [mentors, selectedEvent, lectures, handleEventChange]); + setFilteredNinjas(filtered); + }, + [ninjas, lectures] + ); - useEffect(() => { - setFilteredNinjas( - filteredNinjas.sort((a, b) => a.first_name.localeCompare(b.first_name)) + const [filteredMentors, setFilteredMentors] = useState([]); + useEffect(() => { + const filtered = mentors.filter((mentor) => { + const lecture = lectures.find( + (lecture) => + lecture.mentor.id === mentor.id && + lecture.event.id === selectedEvent.id ); - }, [filteredNinjas]); + return !lecture; + }); + setFilteredMentors(filtered); + }, [mentors, selectedEvent, lectures, handleEventChange]); - useEffect(() => { - setFilteredMentors( - filteredMentors.sort((a, b) => a.first_name.localeCompare(b.first_name)) - ); - }, [filteredMentors]); + useEffect(() => { + setFilteredNinjas( + filteredNinjas.sort((a, b) => a.first_name.localeCompare(b.first_name)) + ); + }, [filteredNinjas]); - const onFinish = (values) => { - if (Object.keys(selectedEvent).length !== 0) { - api - .createLecture(values) - .then(() => { - notifyInfo("Sessão criada com sucesso"); - }) - .catch((error) => { - notifyError("Ocorreu um erro", "Não foi possível criar a sessão"); - router.push("/admin/lectures"); - }); - } - }; - return ( - <> - - Nova sessão - - -