Skip to content

Commit

Permalink
Merge pull request #56 from Rituraj67/master
Browse files Browse the repository at this point in the history 
codeforcescss
  • Loading branch information
@imdeveshshukla
imdeveshshukla authored Sep 2, 2024
2 parents 89a6ae4 + 7720d3e commit 7ae1067
Show file tree
Hide file tree
Showing 5 changed files with 51 additions and 27 deletions.
4 changes: 2 additions & 2 deletions backend/src/controller/auth.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -216,7 +216,7 @@ const varifyOtp = async (req, res) => {
return res
.cookie(updateUser.userID, token, {
path: "/",
expires: new Date(Date.now() + 1000 * 1 * 24 * 60 * 60),
expires: new Date(Date.now() + 1000 * 7 * 24 * 60 * 60),
httpOnly: true,
sameSite: "lax",
})
Expand Down Expand Up @@ -334,7 +334,7 @@ const signin = async (req, res) => {
res
.cookie(user.userID, token, {
path: "/",
expires: new Date(Date.now() + 1000 * 1 * 24 * 60 * 60),
expires: new Date(Date.now() + 1000 * 7 * 24 * 60 * 60),
httpOnly: true,
sameSite: "lax",
})
Expand Down
Binary file added frontend/src/assets/cficon.ico
View file
Binary file not shown.
43 changes: 27 additions & 16 deletions frontend/src/components/ProfileLayout.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -15,6 +15,7 @@ import LeetCode from './LeetCode';
import LeetCodeLogo from '../assets/LeetCodeLogo'
import Codeforces from './Codeforces';
import { setBgImg, setDp } from '../redux/profile';
import cficon from '../assets/cficon.ico'


axios.defaults.withCredentials = true
Expand All @@ -37,7 +38,7 @@ const ProfileLayout = ({ isLoading, user }) => {

const currentPath = location.pathname.split('/').pop();




const handleClickOutside = (event) => {
Expand Down Expand Up @@ -96,7 +97,7 @@ const ProfileLayout = ({ isLoading, user }) => {
</div>
<div className=' flex gap-4'>
<button onClick={() => setIsOpen(false)} className='px-4 py-2 rounded-3xl bg-white' type="button">Cancel</button>
<button onClick={() => handleDpChange({dpLoc,setBtnLoading,setIsOpen,dispatch})} className='px-4 py-2 rounded-3xl bg-blue-700' type="button">{btnLoading ? <SmallLoader /> : "Save"}</button>
<button onClick={() => handleDpChange({ dpLoc, setBtnLoading, setIsOpen, dispatch })} className='px-4 py-2 rounded-3xl bg-blue-700' type="button">{btnLoading ? <SmallLoader /> : "Save"}</button>
</div>
</div>

Expand All @@ -112,32 +113,42 @@ const ProfileLayout = ({ isLoading, user }) => {
<div className='relative rounded-full'>

<div className=' rounded-full border-2 border-[#707416ee] overflow-hidden w-32 h-32 xs:w-36 xs:h-36'>
<img
src={(userInfo?.username === user?.username && userInfo?.dp) ? userInfo.dp : user?.dp ? user.dp : dp}
alt="Profile"
className="w-full h-full object-cover bg-white"
/>
<img
src={(userInfo?.username === user?.username && userInfo?.dp) ? userInfo.dp : user?.dp ? user.dp : dp}
alt="Profile"
className="w-full h-full object-cover bg-white"
/>

</div>
{userInfo?.username === user.username && <button onClick={() => setIsOpen(true)} type='button' className='absolute right-[5%] bottom-[5%] text-2xl rounded-full p-1 border border-black bg-neutral-400 hover:bg-slate-300 '><PiCameraPlusLight /></button>}
</div>
<div className='flex flex-col gap-1'>
<div className=' text-lg xxs:text-2xl break-words xs:text-3xl font-bold'>{user.username}</div>
<div className=' relative flex flex-col gap-1'>
<div className=' text-lg break-words sm:text-3xl font-bold'>{user.username}</div>
<div className=' text-xs xxs:text-base font-semibold text-gray-700'>u/{user.username}</div>
<div className=' text-sm xxs:text-base break-words font-semibold text-gray-800'>{userInfo?.bio}</div>
{user?.showCf&&<div className=' text-sm xxs:text-base break-words font-semibold text-gray-800'><Codeforces rating={user?.codeforces}/></div>}

</div>



<div className=' 1_5md:hidden absolute top-4 right-4 xxs:right-8 xs:right-12 sm:right-20 '><OnclickCard /></div>
<div className=' flex items-center gap-3 absolute bottom-3 right-4 xxs:right-8 xs:right-12 sm:right-20 '>
{user.showLC &&
<button onClick={() => setshowLCard(true)} className=' bg-black rounded-full flex p-2 items-center justify-center'>
<LeetCodeLogo />
</button>
}
{<span className='1_5md:hidden'> <OnclickCard /></span>}
</div>

{user?.showCf && <div className=' absolute top-4 right-4 xxs:right-8 xs:right-12 sm:right-20 flex items-center gap-2'>
<img height={16} width={16} src={cficon} alt="" />
<div className=' text-sm xxs:text-base break-words font-semibold text-gray-800'><Codeforces rating={user?.codeforces} /></div></div>}

{user.showLC && <div className=' absolute bottom-4 right-4 xxs:right-8 xs:right-12 sm:right-20 '>
{/* {user.showLC && <div className=' absolute bottom-3 right-4 xxs:right-8 xs:right-12 sm:right-20 '>
<button onClick={() => setshowLCard(true)} className=' bg-black rounded-full flex p-2 items-center justify-center'>
<LeetCodeLogo />
</button>
</div>}
</div>} */}

{showLCard && <div className='fixed top-[74.46px] z-50 left-0 w-[100vw] h-[calc(100vh-74.46px)] bg-black bg-opacity-50 backdrop-blur-md ' >

Expand Down Expand Up @@ -172,9 +183,9 @@ const ProfileLayout = ({ isLoading, user }) => {

export default ProfileLayout;

export const handleDpChange = async ({dpLoc, setBtnLoading, dispatch,setIsOpen}) => {
export const handleDpChange = async ({ dpLoc, setBtnLoading, dispatch, setIsOpen }) => {

if(!dpLoc){
if (!dpLoc) {
return;
}
const formData = new FormData();
Expand All @@ -190,7 +201,7 @@ export const handleDpChange = async ({dpLoc, setBtnLoading, dispatch,setIsOpen})

if (res.status == 202) {
console.log(res);

dispatch(setUserInfo(res.data));
dispatch(setDp(res.data.dp))
toast.success("Profile Picture Updated !")
Expand Down
29 changes: 21 additions & 8 deletions frontend/src/pages/CreatePost.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -17,6 +17,8 @@ const CreatePost = ({ setShowCP, onNewPost, roomTitle, setPost }) => {
const [description, setDescription] = useState('');
const [image, setImage] = useState(null);
const [Btnloading, setLoading] = useState(false);
const [mediaLoading, setmediaLoading] = useState(false)
const [disable, setdisable] = useState(false)
const location = useLocation();
const selectFile = useRef(null);

Expand All @@ -37,14 +39,19 @@ const [error, seterror] = useState("")

const handleChange = async (e) => {
const file = e.target.files[0];

// Check if file exists

if (!file) return;
setmediaLoading(true)
setdisable(true)

// Check file size
if (file.size <= 3 * 1024 * 1024) {
console.log(file);

if (file.size <= 3 * 1024 * 1024) {3,145,728
// File size is less than or equal to 3MB, no need to compress
setImage(file);
setdisable(false)
setmediaLoading(false)
return;
}

Expand All @@ -61,8 +68,13 @@ const [error, seterror] = useState("")
} catch (error) {
console.error('Error compressing image:', error);
}
setmediaLoading(false)
setdisable(false)
};




const handleSelectChange = (event) => {
setSelectedOption(event.target.value);
};
Expand Down Expand Up @@ -210,19 +222,20 @@ const [error, seterror] = useState("")
Image
</label>
<div className=" text-sm text-blue-900 line-clamp-1 ml-2 break-words mb-2 underline cursor-not-allowed">{image?.name}</div>
<div>
<button onClick={() => selectFile.current?.click()}
className='flex items-center gap-2 border-2 text-blue-800 rounded-3xl border-blue-800 px-3 py-1 bg bg-blue-300 hover:bg-blue-400'
<div className=" flex items-center gap-2 ">
<button disabled={disable} onClick={() => selectFile.current?.click()}
className={` ${disable && ' cursor-wait'} flex items-center gap-2 border-2 text-blue-800 rounded-3xl border-blue-800 px-3 py-1 bg bg-blue-300 hover:bg-blue-400`}
type="button">
<span>Upload</span><GrGallery /></button>
{mediaLoading && <SmallLoader/>}
</div>
<input onChange={(e) => handleChange(e)} accept='image/*' ref={selectFile} type="file" name="media" id="media" hidden />
</div>
{/* Submit Button */}

<button
<button disabled={disable}
onClick={() => handleSubmit()}
className="bg-[#656923] flex justify-center hover:bg-[#a9aa88] w-full text-xl text-black font-bold py-2 px-4 rounded focus:outline-none">
className={`${disable && 'bg-[#666923bd] cursor-wait'} bg-[#656923] flex justify-center hover:bg-[#a9aa88] w-full text-xl text-black font-bold py-2 px-4 rounded focus:outline-none`}>
{Btnloading ? <span className=""><SmallLoader /></span> : "Post"}
</button>
</div>
Expand Down
2 changes: 1 addition & 1 deletion frontend/src/pages/Overview.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -102,7 +102,7 @@ const Overview = () => {

const fetchMoreData = () => {
if (isLoading || !hasMore) return;
setPage(prevPage => prevPage + 1);
setPage(prevPage => prevPage + 1);
};

return (
Expand Down

0 comments on commit 7ae1067

Please sign in to comment.