From d4f6a3e3d5c92e8167c79ead12073390d7230fbf Mon Sep 17 00:00:00 2001 From: ghassenbenzahra123 Date: Wed, 9 Feb 2022 04:41:09 +0100 Subject: [PATCH] final components --- client/src/App.css | 12 +- client/src/App.jsx | 46 ++++++- client/src/components/Auth.jsx | 2 +- client/src/components/ChannelContainer.jsx | 39 +++++- client/src/components/ChannelInner.jsx | 94 +++++++++++++++ .../src/components/ChannelListContainer.jsx | 90 ++++++++++++-- client/src/components/ChannelSearch.jsx | 73 +++++++++--- client/src/components/CreateChannel.jsx | 62 ++++++++++ client/src/components/EditChannel.jsx | 61 ++++++++++ client/src/components/ResultsDropdown.jsx | 112 ++++++++++++++++++ client/src/components/TeamChannelList.jsx | 11 +- client/src/components/TeamChannelPreview.jsx | 15 ++- client/src/components/UserList.jsx | 110 +++++++++++++++++ client/src/components/index.js | 7 +- server/controllers/auth.js | 45 ++++--- server/routes/auth.js | 9 +- 16 files changed, 715 insertions(+), 73 deletions(-) create mode 100644 client/src/components/ChannelInner.jsx create mode 100644 client/src/components/CreateChannel.jsx create mode 100644 client/src/components/EditChannel.jsx create mode 100644 client/src/components/ResultsDropdown.jsx create mode 100644 client/src/components/UserList.jsx diff --git a/client/src/App.css b/client/src/App.css index 0acf959..8b77bdf 100644 --- a/client/src/App.css +++ b/client/src/App.css @@ -1696,11 +1696,11 @@ div.rta__autocomplete.str-chat__emojisearch { outline: none; } -.team-channerl-header_menu-icon { +.team-channel-header_menu-icon { display: none; } -.channerl-list__container-toggle { +.channel-list__container-toggle { display: none; height: 50px; width: 50px; @@ -1733,7 +1733,7 @@ div.rta__autocomplete.str-chat__emojisearch { display: none; } - .team-channerl-header_menu-icon { + .team-channel-header_menu-icon { display: flex; } @@ -1771,7 +1771,7 @@ div.rta__autocomplete.str-chat__emojisearch { width: 100%; } - .channerl-list__container-toggle { + .channel-list__container-toggle { display: flex; } @@ -1796,7 +1796,7 @@ div.rta__autocomplete.str-chat__emojisearch { } @media screen and (max-width: 650px) { - .channerl-list__container-toggle { + .channel-list__container-toggle { right: -3%; } } @@ -1806,7 +1806,7 @@ div.rta__autocomplete.str-chat__emojisearch { width: 150px; } - .channerl-list__container-toggle { + .channel-list__container-toggle { right: -5%; } } diff --git a/client/src/App.jsx b/client/src/App.jsx index 8cb0083..a0b8f1f 100644 --- a/client/src/App.jsx +++ b/client/src/App.jsx @@ -1,18 +1,54 @@ -import React from 'react'; +import React, { useState } from 'react'; import { StreamChat } from 'stream-chat'; import { Chat } from 'stream-chat-react'; import Cookies from 'universal-cookie'; import { ChannelListContainer, ChannelContainer, Auth } from './components'; -import './App.css' + +import 'stream-chat-react/dist/css/index.css'; +import './App.css'; + +const cookies = new Cookies(); + const apiKey = '8sxnm6cqgmtd'; + +const authToken = cookies.get("token"); const client = StreamChat.getInstance(apiKey); -const authToken = false; + + +if (authToken) { + client.connectUser({ + id: cookies.get('userId'), + name: cookies.get('username'), + fullName: cookies.get('fullName'), + image: cookies.get('avatarURL'), + hashedPassword: cookies.get('hashedPassword'), + phoneNumber: cookies.get('phoneNumber'), + }, authToken) +} + + function App() { + + const [createType, setCreateType] = useState(''); + const [isCreating, setIsCreating] = useState(false); + const [isEditing, setIsEditing] = useState(false); + + if (!authToken) return return
- - + +
; } diff --git a/client/src/components/Auth.jsx b/client/src/components/Auth.jsx index be03e68..e3d3df1 100644 --- a/client/src/components/Auth.jsx +++ b/client/src/components/Auth.jsx @@ -26,7 +26,7 @@ const Auth = () => { const { username, password, phoneNumber, avatarURL } = form; - const URL = 'https://localhost:5000/auth'; + const URL = 'http://localhost:5000/auth'; // const URL = 'https://medical-pager.herokuapp.com/auth'; const { data: { token, userId, hashedPassword, fullName } } = await axios.post(`${URL}/${isSignup ? 'signup' : 'login'}`, { diff --git a/client/src/components/ChannelContainer.jsx b/client/src/components/ChannelContainer.jsx index 9481cfb..12ce2ba 100644 --- a/client/src/components/ChannelContainer.jsx +++ b/client/src/components/ChannelContainer.jsx @@ -1,9 +1,42 @@ import React from 'react'; +import { Channel, MessageTeam } from 'stream-chat-react'; -const ChannelContainer = () => { - return ( - Channel Container +import { ChannelInner, CreateChannel, EditChannel } from '.'; +const ChannelContainer = ({ isCreating, setIsCreating, isEditing, setIsEditing, createType }) => { + + if (isCreating) { + return ( +
+ +
+ ) + } + + if (isEditing) { + return ( +
+ +
+ ) + } + + const EmptyState = () => ( +
+

This is the beginning of your chat history.

+

Send messages, attachments, links, emojis, and more!

+
) + + return ( +
+ } + > + + +
+ ); }; export default ChannelContainer; diff --git a/client/src/components/ChannelInner.jsx b/client/src/components/ChannelInner.jsx new file mode 100644 index 0000000..7136ddf --- /dev/null +++ b/client/src/components/ChannelInner.jsx @@ -0,0 +1,94 @@ +import React, { useState } from 'react'; +import { MessageList, MessageInput, Thread, Window, useChannelActionContext, Avatar, useChannelStateContext, useChatContext } from 'stream-chat-react'; + +import { ChannelInfo } from '../assets'; + +export const GiphyContext = React.createContext({}); + +const ChannelInner = ({ setIsEditing }) => { + const [giphyState, setGiphyState] = useState(false); + const { sendMessage } = useChannelActionContext(); + + const overrideSubmitHandler = (message) => { + let updatedMessage = { + attachments: message.attachments, + mentioned_users: message.mentioned_users, + parent_id: message.parent?.id, + parent: message.parent, + text: message.text, + }; + + if (giphyState) { + updatedMessage = { ...updatedMessage, text: `/giphy ${message.text}` }; + } + + if (sendMessage) { + sendMessage(updatedMessage); + setGiphyState(false); + } + }; + + return ( + +
+ + + + + + +
+ + ); +}; + +const TeamChannelHeader = ({ setIsEditing }) => { + const { channel, watcher_count } = useChannelStateContext(); + const { client } = useChatContext(); + + const MessagingHeader = () => { + const members = Object.values(channel.state.members).filter(({ user }) => user.id !== client.userID); + const additionalMembers = members.length - 3; + + if (channel.type === 'messaging') { + return ( +
+ {members.map(({ user }, i) => ( +
+ +

{user.fullName || user.id}

+
+ ))} + + {additionalMembers > 0 &&

and {additionalMembers} more

} +
+ ); + } + + return ( +
+

# {channel.data.name}

+ setIsEditing(true)}> + + +
+ ); + }; + + const getWatcherText = (watchers) => { + if (!watchers) return 'No users online'; + if (watchers === 1) return '1 user online'; + return `${watchers} users online`; + }; + + return ( +
+ +
+

{getWatcherText(watcher_count)}

+
+
+ ); +}; + +export default ChannelInner; \ No newline at end of file diff --git a/client/src/components/ChannelListContainer.jsx b/client/src/components/ChannelListContainer.jsx index 7175735..42c82c4 100644 --- a/client/src/components/ChannelListContainer.jsx +++ b/client/src/components/ChannelListContainer.jsx @@ -1,11 +1,12 @@ -import React from 'react'; +import React, { useState } from 'react'; import { ChannelList, useChatContext } from 'stream-chat-react'; import Cookies from 'universal-cookie'; import { ChannelSearch, TeamChannelList, TeamChannelPreview } from './'; import ChatIcon from '../assets/chat.png'; import LogoutIcon from '../assets/logout.png'; -const SideBar = () => ( +const cookies = new Cookies(); +const SideBar = ({ logout }) => (
@@ -13,7 +14,7 @@ const SideBar = () => (
-
+
Logout
@@ -26,43 +27,83 @@ const CompanyHeader = () => (
) +const customChannelTeamFilter = (channels) => { + return channels.filter((channel) => channel.type === 'team'); +} + +const customChannelMessagingFilter = (channels) => { + return channels.filter((channel) => channel.type === 'messaging'); +} + +const ChannelListContent = ({ isCreating, setIsCreating, setCreateType, setIsEditing, setToggleContainer }) => { + const { client } = useChatContext(); + const logout = () => { + cookies.remove('phoneNumber'); + cookies.remove('avatarURL'); + cookies.remove('hashedPassword'); + cookies.remove('token'); + cookies.remove('username'); + cookies.remove('fullName'); + cookies.remove('userId'); + window.location.reload(); + } -const ChannelListContainer = () => { + const filters = { members: { $in: [client.userID] } } return (<> - +
- + { }} + filters={filters} + channelRenderFilterFn={customChannelTeamFilter} List={(listProps) => ( )} Preview={(previewProps) => ( )} /> { }} + filters={filters} + channelRenderFilterFn={customChannelMessagingFilter} List={(listProps) => ( )} Preview={(previewProps) => ( )} @@ -71,4 +112,33 @@ const ChannelListContainer = () => { ); }; +const ChannelListContainer = ({ setCreateType, setIsCreating, setIsEditing }) => { + const [toggleContainer, setToggleContainer] = useState(false); + + return ( + <> +
+ +
+ +
+
setToggleContainer((prevToggleContainer) => !prevToggleContainer)}> +
+ +
+ + ) +} + export default ChannelListContainer; diff --git a/client/src/components/ChannelSearch.jsx b/client/src/components/ChannelSearch.jsx index b6b7f6e..f93c23c 100644 --- a/client/src/components/ChannelSearch.jsx +++ b/client/src/components/ChannelSearch.jsx @@ -1,42 +1,83 @@ import React, { useState, useEffect } from 'react'; -import { getChannel, useChatContext } from 'stream-chat-react'; -import { SearchIcon } from '../assets'; +import { useChatContext } from 'stream-chat-react'; -const ChannelSearch = () => { +import { ResultsDropdown } from './' +import { SearchIcon } from '../assets'; +const ChannelSearch = ({ setToggleContainer }) => { + const { client, setActiveChannel } = useChatContext(); const [query, setQuery] = useState(''); const [loading, setLoading] = useState(false); + const [teamChannels, setTeamChannels] = useState([]) + const [directChannels, setDirectChannels] = useState([]) + useEffect(() => { + if (!query) { + setTeamChannels([]); + setDirectChannels([]); + } + }, [query]) const getChannels = async (text) => { try { - //TODO: fetch channels - } catch (err) { + const channelResponse = client.queryChannels({ + type: 'team', + name: { $autocomplete: text }, + members: { $in: [client.userID] } + }); + const userResponse = client.queryUsers({ + id: { $ne: client.userID }, + name: { $autocomplete: text } + }) + + const [channels, { users }] = await Promise.all([channelResponse, userResponse]); + + if (channels.length) setTeamChannels(channels); + if (users.length) setDirectChannels(users); + } catch (error) { setQuery('') } } - const onSearch = (e) => { - e.preventDefault(); + + const onSearch = (event) => { + event.preventDefault(); + setLoading(true); - setQuery(e.target.value); - getChannels(e.target.value); + setQuery(event.target.value); + getChannels(event.target.value) + } + + const setChannel = (channel) => { + setQuery(''); + setActiveChannel(channel); } + return ( -
-
-
+
+
+
+ {query && ( + + )}
- ); + ) } -export default ChannelSearch; +export default ChannelSearch \ No newline at end of file diff --git a/client/src/components/CreateChannel.jsx b/client/src/components/CreateChannel.jsx new file mode 100644 index 0000000..6682009 --- /dev/null +++ b/client/src/components/CreateChannel.jsx @@ -0,0 +1,62 @@ +import React, { useState } from 'react'; +import { useChatContext } from 'stream-chat-react'; + +import { UserList } from './'; +import { CloseCreateChannel } from '../assets'; + +const ChannelNameInput = ({ channelName = '', setChannelName }) => { + const handleChange = (event) => { + event.preventDefault(); + + setChannelName(event.target.value); + } + + return ( +
+

Name

+ +

Add Members

+
+ ) +} + +const CreateChannel = ({ createType, setIsCreating }) => { + const { client, setActiveChannel } = useChatContext(); + const [selectedUsers, setSelectedUsers] = useState([client.userID || '']) + const [channelName, setChannelName] = useState(''); + + const createChannel = async (e) => { + e.preventDefault(); + + try { + const newChannel = await client.channel(createType, channelName, { + name: channelName, members: selectedUsers + }); + + await newChannel.watch(); + + setChannelName(''); + setIsCreating(false); + setSelectedUsers([client.userID]); + setActiveChannel(newChannel); + } catch (error) { + console.log(error); + } + } + + return ( +
+
+

{createType === 'team' ? 'Create a New Channel' : 'Send a Direct Message'}

+ +
+ {createType === 'team' && } + +
+

{createType === 'team' ? 'Create Channel' : 'Create Message Group'}

+
+
+ ) +} + +export default CreateChannel \ No newline at end of file diff --git a/client/src/components/EditChannel.jsx b/client/src/components/EditChannel.jsx new file mode 100644 index 0000000..03f4647 --- /dev/null +++ b/client/src/components/EditChannel.jsx @@ -0,0 +1,61 @@ +import React, { useState } from 'react'; +import { useChatContext } from 'stream-chat-react'; + +import { UserList } from './'; +import { CloseCreateChannel } from '../assets'; + +const ChannelNameInput = ({ channelName = '', setChannelName }) => { + const handleChange = (event) => { + event.preventDefault(); + + setChannelName(event.target.value); + } + + return ( +
+

Name

+ +

Add Members

+
+ ) +} + +const EditChannel = ({ setIsEditing }) => { + const { channel } = useChatContext(); + const [channelName, setChannelName] = useState(channel?.data?.name); + const [selectedUsers, setSelectedUsers] = useState([]) + + const updateChannel = async (event) => { + event.preventDefault(); + + const nameChanged = channelName !== (channel.data.name || channel.data.id); + + if (nameChanged) { + await channel.update({ name: channelName }, { text: `Channel name changed to ${channelName}` }); + } + + if (selectedUsers.length) { + await channel.addMembers(selectedUsers); + } + + setChannelName(null); + setIsEditing(false); + setSelectedUsers([]); + } + + return ( +
+
+

Edit Channel

+ +
+ + +
+

Save Changes

+
+
+ ) +} + +export default EditChannel \ No newline at end of file diff --git a/client/src/components/ResultsDropdown.jsx b/client/src/components/ResultsDropdown.jsx new file mode 100644 index 0000000..ecfec79 --- /dev/null +++ b/client/src/components/ResultsDropdown.jsx @@ -0,0 +1,112 @@ +import React from 'react'; +import { Avatar, useChatContext } from 'stream-chat-react'; + +const channelByUser = async ({ client, setActiveChannel, channel, setChannel }) => { + const filters = { + type: 'messaging', + member_count: 2, + members: { $eq: [client.user.id, client.userID] }, + }; + + const [existingChannel] = await client.queryChannels(filters); + + if (existingChannel) return setActiveChannel(existingChannel); + + const newChannel = client.channel('messaging', { members: [channel.id, client.userID] }); + + setChannel(newChannel) + + return setActiveChannel(newChannel); +}; + +const SearchResult = ({ channel, focusedId, type, setChannel, setToggleContainer }) => { + const { client, setActiveChannel } = useChatContext(); + + if (type === 'channel') { + return ( +
{ + setChannel(channel) + if (setToggleContainer) { + setToggleContainer((prevState) => !prevState) + } + }} + className={focusedId === channel.id ? 'channel-search__result-container__focused' : 'channel-search__result-container'} + > +
#
+

{channel.data.name}

+
+ ); + } + + return ( +
{ + channelByUser({ client, setActiveChannel, channel, setChannel }) + if (setToggleContainer) { + setToggleContainer((prevState) => !prevState) + } + }} + className={focusedId === channel.id ? 'channel-search__result-container__focused' : 'channel-search__result-container'} + > +
+ +

{channel.name}

+
+
+ ); +}; + +const ResultsDropdown = ({ teamChannels, directChannels, focusedId, loading, setChannel, setToggleContainer }) => { + + return ( +
+

Channels

+ {loading && !teamChannels.length && ( +

+ Loading... +

+ )} + {!loading && !teamChannels.length ? ( +

+ No channels found +

+ ) : ( + teamChannels?.map((channel, i) => ( + + )) + )} +

Users

+ {loading && !directChannels.length && ( +

+ Loading... +

+ )} + {!loading && !directChannels.length ? ( +

+ No direct messages found +

+ ) : ( + directChannels?.map((channel, i) => ( + + )) + )} +
+ ); +}; + +export default ResultsDropdown; \ No newline at end of file diff --git a/client/src/components/TeamChannelList.jsx b/client/src/components/TeamChannelList.jsx index 62eaaaf..703b1aa 100644 --- a/client/src/components/TeamChannelList.jsx +++ b/client/src/components/TeamChannelList.jsx @@ -2,7 +2,7 @@ import React from 'react'; import { AddChannel } from '../assets'; -const TeamChannelList = ({ children, error = false, loading, type }) => { +const TeamChannelList = ({ children, error = false, loading, type, isCreating, setIsCreating, setCreateType, setIsEditing, setToggleContainer }) => { if (error) { return type === 'team' ? ( @@ -32,7 +32,14 @@ const TeamChannelList = ({ children, error = false, loading, type }) => { {type === 'team' ? 'Channels' : 'Direct Messages'}

- {/*Button add channel */} + +
{children}
diff --git a/client/src/components/TeamChannelPreview.jsx b/client/src/components/TeamChannelPreview.jsx index 91d8de2..83c4c6a 100644 --- a/client/src/components/TeamChannelPreview.jsx +++ b/client/src/components/TeamChannelPreview.jsx @@ -1,6 +1,6 @@ import React from 'react'; import { Avatar, useChatContext } from 'stream-chat-react'; -const TeamChannelPreview = ({ channel, type }) => { +const TeamChannelPreview = ({ setActiveChannel, channel, type, setToggleContainer, setIsCreating, setIsEditing }) => { const { channel: activeChannel, client } = useChatContext(); const ChannelPreview = () => ( @@ -15,15 +15,15 @@ const TeamChannelPreview = ({ channel, type }) => { const members = Object.values(channel.state.members).filter(({ user }) => user.id !== client.userID); return ( -
+
-

{members[0]?.user?.fullName}

+

{members[0]?.user?.fullName || members[0]?.user?.id}

) } @@ -38,7 +38,12 @@ const TeamChannelPreview = ({ channel, type }) => { : 'channel-preview__wrapper' } onClick={() => { - console.log(channel); + setIsCreating(false); + setIsEditing(false); + setActiveChannel(channel); + if (setToggleContainer) { + setToggleContainer((prevState) => !prevState) + } }} > diff --git a/client/src/components/UserList.jsx b/client/src/components/UserList.jsx new file mode 100644 index 0000000..a9a573e --- /dev/null +++ b/client/src/components/UserList.jsx @@ -0,0 +1,110 @@ +import React, { useEffect, useState } from 'react'; +import { Avatar, useChatContext } from 'stream-chat-react'; + +import { InviteIcon } from '../assets'; + +const ListContainer = ({ children }) => { + return ( +
+
+

User

+

Invite

+
+ {children} +
+ ) +} + +const UserItem = ({ user, setSelectedUsers }) => { + const [selected, setSelected] = useState(false) + + const handleSelect = () => { + if (selected) { + setSelectedUsers((prevUsers) => prevUsers.filter((prevUser) => prevUser !== user.id)) + } else { + setSelectedUsers((prevUsers) => [...prevUsers, user.id]) + } + + setSelected((prevSelected) => !prevSelected) + } + + return ( +
+
+ +

{user.fullName || user.id}

+
+ {selected ? :
} +
+ ) +} + + +const UserList = ({ setSelectedUsers }) => { + const { client } = useChatContext(); + const [users, setUsers] = useState([]); + const [loading, setLoading] = useState(false); + const [listEmpty, setListEmpty] = useState(false); + const [error, setError] = useState(false); + + useEffect(() => { + const getUsers = async () => { + if (loading) return; + + setLoading(true); + + try { + const response = await client.queryUsers( + { id: { $ne: client.userID } }, + { id: 1 }, + { limit: 8 } + ); + + if (response.users.length) { + setUsers(response.users); + } else { + setListEmpty(true); + } + } catch (error) { + setError(true); + } + setLoading(false); + } + + if (client) getUsers() + }, []); + + if (error) { + return ( + +
+ Error loading, please refresh and try again. +
+ + ) + } + + if (listEmpty) { + return ( + +
+ No users found. +
+ + ) + } + + return ( + + {loading ?
+ Loading users... +
: ( + users?.map((user, i) => ( + + )) + )} + + ) +} + +export default UserList; \ No newline at end of file diff --git a/client/src/components/index.js b/client/src/components/index.js index f57e340..755a183 100644 --- a/client/src/components/index.js +++ b/client/src/components/index.js @@ -3,4 +3,9 @@ export { default as ChannelListContainer } from './ChannelListContainer' export { default as ChannelSearch } from './ChannelSearch' export { default as TeamChannelList } from './TeamChannelList' export { default as TeamChannelPreview } from './TeamChannelPreview' -export { default as Auth } from './Auth' \ No newline at end of file +export { default as Auth } from './Auth' +export { default as ChannelInner } from './ChannelInner' +export { default as CreateChannel } from './CreateChannel' +export { default as EditChannel } from './EditChannel' +export { default as UserList } from './UserList' +export { default as ResultsDropdown } from './ResultsDropdown' diff --git a/server/controllers/auth.js b/server/controllers/auth.js index 16f683c..cb265d6 100644 --- a/server/controllers/auth.js +++ b/server/controllers/auth.js @@ -1,8 +1,10 @@ const { connect } = require('getstream'); const bcrypt = require('bcrypt'); -const StreamChat = require('stream-chat'); - +const StreamChat = require('stream-chat').StreamChat; const crypto = require('crypto'); + +require('dotenv').config(); + const api_key = process.env.STREAM_API_KEY; const api_secret = process.env.STREAM_API_SECRET; const app_id = process.env.STREAM_APP_ID; @@ -10,42 +12,49 @@ const app_id = process.env.STREAM_APP_ID; const signup = async (req, res) => { try { const { fullName, username, password, phoneNumber } = req.body; + const userId = crypto.randomBytes(16).toString('hex'); - const serverClient = coonnect(api_key, api_secret, app_id); + + const serverClient = connect(api_key, api_secret, app_id); + const hashedPassword = await bcrypt.hash(password, 10); + const token = serverClient.createUserToken(userId); - res.status(200).json({ token, fullName, usernamen, userId, hashedPassword, phoneNumber }) - } catch (err) { - console.log(err); - resizeBy.status(500).json({ message: err }) - } -} + res.status(200).json({ token, fullName, username, userId, hashedPassword, phoneNumber }); + } catch (error) { + console.log(error); + res.status(500).json({ message: error }); + } +}; const login = async (req, res) => { try { const { username, password } = req.body; - const serverClient = coonnect(api_key, api_secret, app_id); + + const serverClient = connect(api_key, api_secret, app_id); const client = StreamChat.getInstance(api_key, api_secret); const { users } = await client.queryUsers({ name: username }); if (!users.length) return res.status(400).json({ message: 'User not found' }); - const succes = await bcrypt.compare(password, users[0].hashedPassword); + const success = await bcrypt.compare(password, users[0].hashedPassword); const token = serverClient.createUserToken(users[0].id); - if (succes) { + if (success) { res.status(200).json({ token, fullName: users[0].fullName, username, userId: users[0].id }); } else { - res.status(500).json({ message: 'Incorrect password!' }) + res.status(500).json({ message: 'Incorrect password' }); } - } catch (err) { - console.log(err); - resizeBy.status(500).json({ message: err }) + } catch (error) { + ads + console.log(error); + + res.status(500).json({ message: error }); } -} +}; -module.exports = { login, signup } \ No newline at end of file +module.exports = { signup, login } \ No newline at end of file diff --git a/server/routes/auth.js b/server/routes/auth.js index 83cc526..ee734ea 100644 --- a/server/routes/auth.js +++ b/server/routes/auth.js @@ -1,13 +1,10 @@ const express = require('express'); +const { signup, login } = require('../controllers/auth.js'); const router = express.Router(); -const { signupp, login } = require('../controllers/auth.js') - - -router.post('/signup'); -router.post('/login'); - +router.post('/signup', signup); +router.post('/login', login); module.exports = router; \ No newline at end of file