jtpmcdevitt/web_next
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

finished user comment functionality

Browse source
This commit is contained in:
Juthatip McDevitt 2024-03-31 14:11:31 -05:00
parent 389771d33f
commit b3397d7649
10 changed files with 47 additions and 30 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

21
task_management_app/src/app/api/users/route.ts
View file

@ -8,14 +8,25 @@ export async function GET(req: NextRequest){
if(!connectionString){
return new Response('No db connection string', {status:500});
}
if(!url.searchParams.has('ids')){
return Response.json([])
}
const emails = url.searchParams.getAll('ids');
await mongoose.connect(connectionString)
const users = await User.find({email: emails});
let users = [];
if(url.searchParams.get('ids')){
const emails = url.searchParams.get('ids')?.split(',');
users = await User.find({email:{$in:emails}});
}
if(url.toString().includes('?search=')){
const searchPhrase = url.searchParams.get('search');
const searchRegex = `.*${searchPhrase}.*`;
users = await User.find({
$or: [
{name: {$regex: searchRegex}},
{email: {$regex: searchRegex}},
],
})
}
return Response.json(users.map((u:UserType) => ({
id:u.email,
name:u.name,

2
task_management_app/src/app/globals.css
View file

@ -4,7 +4,7 @@
button[type="button"], button[type="submit"], button.primary{
@apply bg-[#164863] text-white p-2 text-sm font-semibold rounded-md flex
@apply bg-[#164863] text-white p-2 text-sm font-semibold rounded-md flex w-full justify-center items-center text-center
}
button[type="submit"], button.primary{
@apply bg-[#427D9D] rounded-md

18
task_management_app/src/app/liveblocks.config.ts
View file

@ -2,13 +2,17 @@ import { LiveList, LiveObject, ThreadData, createClient } from "@liveblocks/clie
import { createRoomContext } from "@liveblocks/react";
const client = createClient({
authEndpoint: "/api/liveblocks-auth",
throttle: 100,
resolveUsers: async ({userIds}) => {
const params = new URLSearchParams(userIds.map(id => ['ids', id]));
const response = await fetch(`/api/users?` + params.toString());
return await response.json();
},
authEndpoint: "/api/liveblocks-auth",
throttle: 100,
resolveUsers: async ({userIds}) => {
const response = await fetch(`/api/users?ids=` + userIds.join(','));
return await response.json();
},
resolveMentionSuggestions: async ({text}) => {
const response = await fetch(`/api/users?search=` + text);
const users = await response.json();
return users.map((user:UserMeta) => user.id);
}
});

2
task_management_app/src/components/Card.tsx
View file

@ -25,7 +25,7 @@ const Card = ({id, name}: {id:string, name:string}) => {
return (
<Link href={`/boards/${params.boardId}/cards/${id}`} className='border block my-2 p-2 rounded-sm bg-white'>
<Link href={`/boards/${params.boardId}/cards/${id}`} className='border block my-2 p-2 rounded-sm bg-white '>
<span>{name}</span>
</Link>
)

2
task_management_app/src/components/Column.tsx
View file

@ -65,7 +65,7 @@ const Column = ({id, name}: ColumnProps) => {
return (
<div className='w-50 shadow-md rounded-md p-2 bg-gray-100'>
<div className=' w-50 shadow-md rounded-md p-2 bg-gray-100'>
{!renameColumn && (
<div className='flex justify-between'>
<h3>{name}</h3>

2
task_management_app/src/components/Columns.tsx
View file

@ -27,7 +27,7 @@ const Columns = () => {
}
return (
<div className='flex gap-4'>
<div className='block lg:flex gap-4'>
<ReactSortable group={'board-column'} list={columns} setList={setColumnsOrder} className="flex gap-4" ghostClass="opacity-40">
{columns?.length >0 && columns.map(column => (
<BoardColumn key={column.id} {...column} />

10
task_management_app/src/components/Header.tsx
View file

@ -9,13 +9,15 @@ const Header = async () => {
return (
<header className="p-4 border border-b-[#9BBEC8] px-10">
<div className='flex justify-between items-center'>
<Link href="/" className="logo">Task Management</Link>
<Link href="/" className="logo text-[#427D9D] font-semibold">Task Management</Link>
<div>
{session && (
<>
Hello, {session?.user?.name}
<div className='flex justify-center items-center'>
<div className='hidden gap-1 md:flex'>
<p className='font-bold'>Hello, </p> {session?.user?.name}
</div>
<LogoutButton/>
</>
</div>
)}
{!session && (
<>

2
task_management_app/src/components/forms/NewCardForm.tsx
View file

@ -28,7 +28,7 @@ const NewCardForm = ({columnId}: {columnId: string}) => {
return (
<form onSubmit={handleNewCardFormSubmit}>
<input type="text" placeholder="card name" className='border my-2 p-2 rounded-sm bg-white'/>
<input type="text" placeholder="card name" className='border my-2 p-1 rounded-sm bg-white w-48'/>
</form>
)
}

3
task_management_app/src/components/views/CardModal.tsx
View file

@ -77,10 +77,9 @@ const CardModal = () => {
}
return (
<div onClick={handleBackdrop} className='fixed inset-0 bg-black/80'>
<div onClick={ev => ev.stopPropagation()} className='bg-white p-4 mt-8 max-w-sm mx-auto'>
<div onClick={ev => ev.stopPropagation()} className='bg-white p-4 mt-8 max-w-sm mx-auto overflow-scroll' style={{maxHeight:"calc(100vh - 2rem)"}}>
{!editCard && (
<div className="flex justify-between">
<p className="mb-6 uppercase text-sm font-semibold">{card?.name}</p>

15
task_management_app/src/lib/authOptions.ts
View file

@ -4,11 +4,12 @@ import GoogleProvider from "next-auth/providers/google";
import { AuthOptions } from "next-auth";
export const authOptions: AuthOptions = {
providers: [
GoogleProvider({
clientId: process.env.GOOGLE_CLIENT_ID as string,
clientSecret: process.env.GOOGLE_CLIENT_SECRET as string,
})
],
adapter: MongoDBAdapter(clientPromise),
secret: process.env.AUTH_SECRET,
providers: [
GoogleProvider({
clientId: process.env.GOOGLE_CLIENT_ID as string,
clientSecret: process.env.GOOGLE_CLIENT_SECRET as string,
})
],
adapter: MongoDBAdapter(clientPromise),
}