Finally fixed input

Adding profile pics for phase1 (hard coded contacts)
Adding chat components
2022-03-06 18:15:21 -05:00 · 2022-03-06 16:22:26 -05:00 · 2022-03-06 15:57:04 -05:00 · 2022-03-06 15:53:19 -05:00 · 2022-03-06 15:40:56 -05:00
18 changed files with 295 additions and 445 deletions
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,6 +0,0 @@
-{
-  "name": "team58",
-  "lockfileVersion": 2,
-  "requires": true,
-  "packages": {}
-}
--- a/sports-matcher/package.json
+++ b/sports-matcher/package.json
@@ -3,18 +3,11 @@
  "version": "0.1.0",
  "private": true,
  "dependencies": {
-    "@emotion/react": "^11.8.1",
-    "@emotion/styled": "^11.8.1",
-    "@mui/icons-material": "^5.4.4",
-    "@mui/material": "^5.4.4",
    "@testing-library/jest-dom": "^5.16.2",
    "@testing-library/react": "^12.1.3",
    "@testing-library/user-event": "^13.5.0",
-    "bootstrap": "^5.1.3",
    "react": "^17.0.2",
-    "react-bootstrap": "^2.2.0",
    "react-dom": "^17.0.2",
-    "react-router-dom": "^6.2.2",
    "react-scripts": "^5.0.0",
    "web-vitals": "^2.1.4"
  },
--- a/sports-matcher/public/chief.jpg
+++ b/sports-matcher/public/chief.jpg
--- a/sports-matcher/public/freeman.jpg
+++ b/sports-matcher/public/freeman.jpg
--- a/sports-matcher/public/index.html
+++ b/sports-matcher/public/index.html
@@ -24,12 +24,6 @@
      work correctly both with client-side routing and a non-root public URL.
      Learn how to configure a non-root public URL by running `npm run build`.
    -->
-    <link
-  rel="stylesheet"
-  href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css"
-  integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3"
-  crossorigin="anonymous"
-/>
    <title>React App</title>
  </head>
  <body>
--- a/sports-matcher/public/shogun.jpg
+++ b/sports-matcher/public/shogun.jpg
--- a/sports-matcher/src/App.js
+++ b/sports-matcher/src/App.js
@@ -1,16 +1,23 @@
+import logo from './logo.svg';
 import './App.css';
-import { Routes, Route, Link } from "react-router-dom";
-import SignIn from './SignIn';
-import SignUp from './SignUp';
-import Home from './Home';
+
 function App() {
  return (
    <div className="App">
-      <Routes>
-        <Route path="" element={<Home />} />
-        <Route path="sign-in" element={<SignIn />} />
-        <Route path="sign-up" element={<SignUp />} />
-      </Routes>
+      <header className="App-header">
+        <img src={logo} className="App-logo" alt="logo" />
+        <p>
+          Edit <code>src/App.js</code> and save to reload.
+        </p>
+        <a
+          className="App-link"
+          href="https://reactjs.org"
+          target="_blank"
+          rel="noopener noreferrer"
+        >
+          Learn React
+        </a>
+      </header>
    </div>
  );
 }
--- a/sports-matcher/src/Chat.js
+++ b/sports-matcher/src/Chat.js
@@ -0,0 +1,18 @@
+/* Please direct questions to Hansi Xu (Wallace LaWall on Discord) */
+
+import React from 'react';
+import './chats.css'
+
+class Chat extends React.Component {
+    render() {
+        return (
+            <div class="chatbubble-container">                    
+                        <div class= {this.props.side === "left" ? "chatbubble left": "chatbubble right"}>
+                            {this.props.message}
+                        </div>
+            </div>
+        )
+    }
+}
+
+export default Chat;
--- a/sports-matcher/src/ChatWindow.js
+++ b/sports-matcher/src/ChatWindow.js
@@ -0,0 +1,113 @@
+/* Please direct questions to Hansi Xu (Wallace LaWall on Discord) */
+
+import React from 'react';
+import './chats.css'
+import Chat from './Chat'
+import Contact from './Contact'
+import { useState } from "react";
+
+class ChatWindow extends React.Component {
+    render() {
+        return (
+            <div class="chatcomponent">
+                <UserList />
+                <MessageList />
+                <ChatInput />
+            </div>
+        )
+    }
+}
+
+class UserList extends React.Component {
+    
+    render() {
+        return (
+            <div class="contactlist">
+                    <Contact pfpsrc="./chief.jpg" name="Master Chief"/>
+                    <Contact pfpsrc="./freeman.jpg" name="Gordon Freeman" />
+                    <Contact pfpsrc="./shogun.jpg" name="Raiden Shogun" selected="true" />
+            </div>
+        )
+    }
+}
+
+class MessageList extends React.Component {
+    render() {
+        return (
+            <div class="messagelist">
+                <Chat message="Got time for tennis this week, Raiden?" side="right"/>
+                <Chat message="Foolish question. If I do not even have free time, How am I to pursue eternity and fulfill my promise to the people of Inazuma?" side="left" />
+                <Chat message="Aiight, see you at 4" side="right" />
+                <Chat message="As you wish." side="left" />
+                </div>
+        )
+    }
+}
+// class ChatWindow extends React.Component {
+//     render() {
+//         return (
+//             <div>
+//                 <ChatUserList />
+//                 {/* <MessageList /> */}
+//             </div>
+//         )
+//     }
+// }
+const ChatInput = () => {
+    const [message, setMessage] = useState( '' );
+    
+    // const onKeyPress = (e) => {
+    //     // if(e.key === 'Enter'){
+    //     //     e.preventDefault(); // Ensure it is only this code that runs
+    //     //     setMessage("")
+    //     // }
+    // }
+
+    const onKeyDown = (e) => {
+        const keyCode = e.which || e.keyCode;
+
+        // 13 represents the Enter key
+        if (keyCode === 13 && !e.shiftKey) {
+            e.preventDefault();
+            setMessage("")
+        }
+    }
+
+    return (
+        // onKeyPress={(e) => onKeyPress(e)}
+      <div>
+        <textarea
+           class="chatinput"
+           value={message}
+           placeholder="Press ENTER to send, SHIFT + ENTER for new line"
+           onChange={e => setMessage(e.target.value)}
+           
+           onKeyDown={onKeyDown}
+         />
+      </div>
+    );
+  };
+class ChatInput2 extends React.Component {
+    
+    constructor(props) {
+        super(props)
+        this.setState({inputVal : ""})
+    }
+
+    handleUserInput(e) {
+        this.setState(this.setState({inputVal : e.target.value}));
+    };
+
+    render() {
+        return (<textarea class="chatinput" placeholder="Press ENTER to send, Ctrl + ENTER for new line"
+                onKeyPress={(e)=>this.onKeyPress(e)} value="" onChange={(e) => this.handleUserInput(e)} />)
+        
+    }
+    onKeyPress(e) {
+        if(e.key === 'Enter'){
+            e.preventDefault(); // Ensure it is only this code that runs
+            this.setState({inputVal : ""});
+        }
+    }
+}
+export default ChatWindow;
--- a/sports-matcher/src/Contact.js
+++ b/sports-matcher/src/Contact.js
@@ -0,0 +1,38 @@
+/* Please direct questions to Hansi Xu (Wallace LaWall on Discord) */
+
+import React from 'react';
+import './chats.css';
+
+class Contact extends React.Component {
+    constructor(props) {
+        super(props)
+        this.state = {
+            selected : this.props.selected
+        }
+    }
+    onClick() {
+        // This toggling of the contact selection is for demo purposes only
+        // Once backend is implemented, only one contact can be selected
+        if (this.state.selected === "false") {
+            this.setState({selected : "true"})
+        } else {
+            this.setState({selected : "false"})
+        }
+        
+    }
+    render() {
+        return (
+            <div class={this.state.selected === "true" ? "contact dark" : "contact"}>
+                        <div class="profilepiccontainer">
+                            <img src={this.props.pfpsrc} class="profilepic" onClick={() => this.onClick()} 
+                                alt="profile" />
+                        </div>
+                        <div class="profilenamecontainer">
+                            <div class="profilename" onClick={() => this.onClick()}>{this.props.name}</div>
+                        </div>
+            </div>
+        )
+    }
+}
+
+export default Contact;
--- a/sports-matcher/src/Home.css
+++ b/sports-matcher/src/Home.css
@@ -1,4 +0,0 @@
-h1, h2{
-    -webkit-text-stroke-width: 1px;
-    -webkit-text-stroke-color: black;
-}
--- a/sports-matcher/src/Home.js
+++ b/sports-matcher/src/Home.js
@@ -1,46 +0,0 @@
-import * as React from 'react';
-import Homebar from './Homebar';
-import { Carousel } from 'react-bootstrap';
-import './Home.css';
-export default function Home() {
-    return(
-    <React.Fragment>
-    <Homebar></Homebar>
-    <Carousel>
-    <Carousel.Item>
-    <img
-      src='https://d39l2hkdp2esp1.cloudfront.net/img/photo/148976/148976_00_2x.jpg'
-      alt="Connect Slide"
-      style={{ height: '680px', width: '2000px'}}
-    />
-    <Carousel.Caption>
-      <h1>Connect</h1>
-      <h2>Connect with other athletes in your area!</h2>
-    </Carousel.Caption>
-  </Carousel.Item>
-  <Carousel.Item>
-    <img
-      src='https://www.groovypost.com/wp-content/uploads/2021/08/sports-calendar-featured.jpg'
-      alt="Schedule Slide"
-      style={{ height: '680px', width: '2000px' }}
-    />
-    <Carousel.Caption>
-      <h1>Schedule</h1>
-      <h2>Schedule sport meets with other athletes!</h2>
-    </Carousel.Caption>
-  </Carousel.Item>
-  <Carousel.Item>
-    <img
-      src='https://i.pinimg.com/736x/dd/80/c3/dd80c3136a96c2fbf6004aef8e9619f3.jpg'
-      alt="Rent Slide"
-      style={{ height: '680px', width: '2000px' }}
-    />
-    <Carousel.Caption>
-      <h1>Rent</h1>
-      <h2>Rent sports equipment from other athletes!</h2>
-    </Carousel.Caption>
-  </Carousel.Item>
-    </Carousel>
-    </React.Fragment>
-    )
-}
--- a/sports-matcher/src/Homebar.js
+++ b/sports-matcher/src/Homebar.js
@@ -1,44 +0,0 @@
-import * as React from 'react';
-import AppBar from '@mui/material/AppBar';
-import Box from '@mui/material/Box';
-import Toolbar from '@mui/material/Toolbar';
-import Typography from '@mui/material/Typography';
-import Container from '@mui/material/Container';
-import Button from '@mui/material/Button';
-import { useNavigate } from 'react-router-dom';
-
-export default function Navbar(){
-
-  const navigate = useNavigate();
-
-  return (
-    <AppBar position="static" sx={{background: '#00226D'}}>
-      <Container maxWidth="xl">
-        <Toolbar disableGutters>
-          <Typography
-            variant="h6"
-            noWrap
-            component="div"
-            sx={{ mr: 2, fontSize: '200%', textAlign: 'center', flexGrow: 1, marginLeft: '10%'}}
-          >
-            Sports Matcher
-          </Typography>
-          <Box sx={{display: { xs: 'none', md: 'flex' }}}>
-              <Button
-                sx={{ my: 2, color: 'white', display: 'block', textTransform: 'none', fontSize: '100%'}}
-                onClick={() => navigate('sign-up')}
-              >
-                Sign Up
-              </Button>
-              <Button
-                sx={{ my: 2, color: 'white', display: 'block', textTransform: 'none', fontSize: '100%'}}
-                onClick={() => navigate('sign-in')}
-              >
-                Sign In
-              </Button>
-          </Box>
-        </Toolbar>
-      </Container>
-    </AppBar>
-  );
-};
--- a/sports-matcher/src/Navbar.js
+++ b/sports-matcher/src/Navbar.js
@@ -1,153 +0,0 @@
-import * as React from 'react';
-import AppBar from '@mui/material/AppBar';
-import Box from '@mui/material/Box';
-import Toolbar from '@mui/material/Toolbar';
-import IconButton from '@mui/material/IconButton';
-import Typography from '@mui/material/Typography';
-import Menu from '@mui/material/Menu';
-import MenuIcon from '@mui/icons-material/Menu';
-import Container from '@mui/material/Container';
-import Button from '@mui/material/Button';
-import Tooltip from '@mui/material/Tooltip';
-import MenuItem from '@mui/material/MenuItem';
-import AccountCircle from '@mui/icons-material/AccountCircle';
-import ForumIcon from '@mui/icons-material/Forum';
-import { useNavigate } from 'react-router-dom';
-
-const pages = ['Dashboard'];
-
-export default function Navbar(){
-  const [anchorElNav, setAnchorElNav] = React.useState(null);
-  const [anchorElUser, setAnchorElUser] = React.useState(null);
-
-  const handleOpenNavMenu = (event) => {
-    setAnchorElNav(event.currentTarget);
-  };
-  const handleOpenUserMenu = (event) => {
-    setAnchorElUser(event.currentTarget);
-  };
-
-  const handleCloseNavMenu = () => {
-    setAnchorElNav(null);
-  };
-
-  const handleCloseUserMenu = () => {
-    setAnchorElUser(null);
-  };
-
-  const navigate = useNavigate();
-
-  return (
-    <AppBar position="static" sx={{background: '#00226D'}}>
-      <Container maxWidth="xl">
-        <Toolbar disableGutters>
-          <Typography
-            variant="h6"
-            noWrap
-            component="div"
-            sx={{ mr: 2, display: { xs: 'none', md: 'flex' }, fontSize: '150%', borderRight: '0.05em solid black', borderColor: 'white', paddingRight: '1.5em' }}
-          >
-            Sports Matcher
-          </Typography>
-
-          <Box sx={{ flexGrow: 1, display: { xs: 'flex', md: 'none' } }}>
-            <IconButton
-              size="large"
-              aria-label="account of current user"
-              aria-controls="menu-appbar"
-              aria-haspopup="true"
-              onClick={handleOpenNavMenu}
-              color="inherit"
-            >
-              <MenuIcon />
-            </IconButton>
-            <Menu
-              id="menu-appbar"
-              anchorEl={anchorElNav}
-              anchorOrigin={{
-                vertical: 'bottom',
-                horizontal: 'left',
-              }}
-              keepMounted
-              transformOrigin={{
-                vertical: 'top',
-                horizontal: 'left',
-              }}
-              open={Boolean(anchorElNav)}
-              onClose={handleCloseNavMenu}
-              sx={{
-                display: { xs: 'block', md: 'none' },
-              }}
-            >
-              {pages.map((page) => (
-                <MenuItem key={page} onClick={handleCloseNavMenu}>
-                  <Typography textAlign="center">{page}</Typography>
-                </MenuItem>
-              ))}
-            </Menu>
-          </Box>
-          <Typography
-            variant="h6"
-            noWrap
-            component="div"
-            sx={{ flexGrow: 1, display: { xs: 'flex', md: 'none' } }}
-          >
-            Sports Matcher
-          </Typography>
-          <Box sx={{ flexGrow: 1, display: { xs: 'none', md: 'flex' }, marginLeft: '2%' }}>
-            {pages.map((page) => (
-              <Button
-                key={page}
-                onClick={handleCloseNavMenu}
-                sx={{ my: 2, color: 'white', display: 'block', textTransform: 'none', fontSize: '100%'}}
-              >
-                {page}
-              </Button>
-            ))}
-          </Box>
-
-          <Box sx={{ flexGrow: 0, marginRight: '1%'}}>
-           <Tooltip title="Chats">
-              <IconButton sx={{ p: 0}}>
-                <ForumIcon sx={{color: 'white'}}></ForumIcon>
-              </IconButton>
-            </Tooltip>
-            </Box>
-            <Box sx={{ flexGrow: 0 }}>
-            <Tooltip title="Settings">
-              <IconButton onClick={handleOpenUserMenu} sx={{ p: 0}}>
-                <AccountCircle sx={{color: 'white'}}></AccountCircle>
-              </IconButton>
-            </Tooltip>
-            <Menu
-              sx={{ mt: '30px' }}
-              id="menu-appbar"
-              anchorEl={anchorElUser}
-              anchorOrigin={{
-                vertical: 'top',
-                horizontal: 'right',
-              }}
-              keepMounted
-              transformOrigin={{
-                vertical: 'top',
-                horizontal: 'right',
-              }}
-              open={Boolean(anchorElUser)}
-              onClose={handleCloseUserMenu}
-            >
-                <MenuItem onClick={handleCloseUserMenu}>
-                  <Typography textAlign="center">Profile</Typography>
-                </MenuItem>
-                <MenuItem onClick={handleCloseUserMenu}>
-                  <Typography textAlign="center">Account</Typography>
-                </MenuItem>
-                <MenuItem onClick={() => navigate('sign-in')}>
-                  <Typography textAlign="center">Sign Out</Typography>
-                </MenuItem>
-            </Menu>
-          </Box>
-        </Toolbar>
-      </Container>
-    </AppBar>
-  );
-};
--- a/sports-matcher/src/SignIn.js
+++ b/sports-matcher/src/SignIn.js
@@ -1,75 +0,0 @@
-import * as React from 'react';
-import Avatar from '@mui/material/Avatar';
-import Button from '@mui/material/Button';
-import CssBaseline from '@mui/material/CssBaseline';
-import TextField from '@mui/material/TextField';
-import Box from '@mui/material/Box';
-import Typography from '@mui/material/Typography';
-import Container from '@mui/material/Container';
-import { Link } from '@mui/material';
-import AccountCircleIcon from '@mui/icons-material/AccountCircle';
-import { useNavigate } from 'react-router-dom';
-
-export default function SignIn() {
-  const navigate = useNavigate();
-  const handleSubmit = (event) => {
-    event.preventDefault();
-    const data = new FormData(event.currentTarget);
-    // eslint-disable-next-line no-console
-    if(data.get('username') == "admin" && data.get('password') == "admin"){
-      navigate('/');
-    }
-  };
-  return (
-      <Container component="main" maxWidth="xs">
-        <CssBaseline />
-        <Box
-          sx={{
-            marginTop: 8,
-            display: 'flex',
-            flexDirection: 'column',
-            alignItems: 'center',
-          }}
-        >
-          <Avatar sx={{ m: 1, bgcolor: 'primary.main' }}>
-            <AccountCircleIcon />
-          </Avatar>
-          <Typography component="h1" variant="h5">
-            Sign in
-          </Typography>
-          <Box component="form" noValidate sx={{ mt: 1 }} onSubmit={handleSubmit}>
-            <TextField
-              margin="normal"
-              required
-              fullWidth
-              id="username"
-              label="Username"
-              name="username"
-              autoComplete="username"
-              autoFocus
-            />
-            <TextField
-              margin="normal"
-              required
-              fullWidth
-              name="password"
-              label="Password"
-              type="password"
-              id="password"
-              autoComplete="current-password"
-            />
-            <Button
-              type="submit"
-              fullWidth
-              variant="contained"
-              sx={{ mt: 3, mb: 2 }}
-            >
-              Sign In
-            </Button>
-            <Link href="/sign-up" underline="always">
-            {"Don't have an account?"}
-            </Link>
-            </Box>
-            </Box>
-            </Container>
-            )}
--- a/sports-matcher/src/SignUp.js
+++ b/sports-matcher/src/SignUp.js
@@ -1,92 +0,0 @@
-import * as React from 'react';
-import Avatar from '@mui/material/Avatar';
-import Button from '@mui/material/Button';
-import CssBaseline from '@mui/material/CssBaseline';
-import TextField from '@mui/material/TextField';
-import Box from '@mui/material/Box';
-import AccountBoxIcon from '@mui/icons-material/AccountBox';
-import Typography from '@mui/material/Typography';
-import Container from '@mui/material/Container';
-import { Link } from '@mui/material';
-import { Grid } from '@mui/material';
-import { useNavigate } from 'react-router-dom';
-
-export default function SignUp() {
-  return (
-      <Container component="main" maxWidth="xs">
-        <CssBaseline />
-        <Box
-          sx={{
-            marginTop: 8,
-            display: 'flex',
-            flexDirection: 'column',
-            alignItems: 'center',
-          }}
-        >
-          <Avatar sx={{ m: 1, bgcolor: 'info.main' }}>
-            <AccountBoxIcon />
-          </Avatar>
-          <Typography component="h1" variant="h5">
-            Sign up
-          </Typography>
-          <Box component="form" noValidate sx={{ mt: 1 }}>
-          <Grid container spacing={2}>
-              <Grid item xs={12} sm={6}>
-                <TextField
-                  autoComplete="given-name"
-                  name="firstName"
-                  required
-                  fullWidth
-                  id="firstName"
-                  label="First Name"
-                  autoFocus
-                />
-              </Grid>
-              <Grid item xs={12} sm={6}>
-                <TextField
-                  required
-                  fullWidth
-                  id="lastName"
-                  label="Last Name"
-                  name="lastName"
-                  autoComplete="family-name"
-                />
-              </Grid>
-              <Grid item xs={12}>
-                <TextField
-                  required
-                  fullWidth
-                  id="email"
-                  label="Email Address"
-                  name="email"
-                  autoComplete="email"
-                />
-              </Grid>
-              <Grid item xs={12}>
-                <TextField
-                  required
-                  fullWidth
-                  name="password"
-                  label="Password"
-                  type="password"
-                  id="password"
-                  autoComplete="new-password"
-                />
-              </Grid>
-            </Grid>
-            <Button
-              type="submit"
-              fullWidth
-              variant="contained"
-              color='info'
-              sx={{ mt: 3, mb: 2 }}
-            >
-              Sign Up
-            </Button>
-            <Link href="/sign-in" underline="always">
-            {'Already have an account?'}
-            </Link>
-            </Box>
-            </Box>
-            </Container>
-            )}
--- a/sports-matcher/src/chats.css
+++ b/sports-matcher/src/chats.css
@@ -0,0 +1,108 @@
+/* Please direct questions to Hansi Xu (Wallace LaWall on Discord) */
+
+.chatcomponent > * {
+    display: inline-block;
+}
+.contact {
+    border-style: solid;
+    border-width: 1px;
+    border-bottom: 1px;
+    border-color:rgb(75, 75, 75);
+
+    background-color: rgb(80, 80, 80);
+    height: 70px;
+
+    user-select: none;
+}
+.contact.dark {
+    background-color: black;
+}
+.contactlist {
+    height: 500px;
+    width: 200px;
+    top: 0;
+    left: 0;
+    box-sizing: border-box;
+    border-radius: 2%;
+    background: rgb(48, 45, 45);
+    overflow-y: scroll;
+    overflow-x: hidden;
+
+    text-align: center;
+}
+.messagelist {
+    height: 400px;
+    width: 800px;
+    top: 0px;
+    left: 200px;
+
+    position: absolute;
+    background-color: rgb(80, 80, 80);
+    overflow-x: hidden;
+    overflow-y: scroll;
+}
+.messagelist > * {
+    display: block;
+}
+.profilepiccontainer {
+    height: 60px;
+    width: 60px;
+    margin-top: 10px;
+    margin-left: 10px;
+    margin-right: 10px;
+    float: left;
+}
+.profilepic {
+    border-radius: 50%;
+    height: 50px;
+    width: 50px;
+}
+.profilenamecontainer {
+    text-align: center;
+    padding: 7%;
+}
+.profilename {
+    color: white;
+}
+.chatbubble {
+	margin-top: 20px;
+    margin-left: 20px;
+    display: inline-block;
+    position: relative;
+	width: auto;
+	height: auto;
+    padding: 10px;
+	
+    border-radius: 10px;
+}
+.left {
+    background-color: rgba(0, 57, 163, 0.637);
+    margin-right: 35px;
+    color: white;
+    float: auto;
+}
+.right {
+    background-color: khaki;
+    color: black;
+    margin-right: 35px;
+    float: right;
+}
+.chatbubble-container {
+    width: 800px;
+    height: auto;
+    float: left;
+}
+.chatinput {
+    background-color: rgb(75, 75, 75);
+    top: 400px;
+    left: 200px;
+    position: absolute;
+
+    height: 92px;
+    width: 793px;
+
+    color: antiquewhite;
+
+    border-width: 2px;
+    border-color: rgb(48, 45, 45);
+}
--- a/sports-matcher/src/index.js
+++ b/sports-matcher/src/index.js
@@ -1,14 +1,13 @@
 import React from 'react';
 import ReactDOM from 'react-dom';
-import { BrowserRouter } from "react-router-dom";
 import './index.css';
 import App from './App';
 import reportWebVitals from './reportWebVitals';

 ReactDOM.render(
-  <BrowserRouter>
+  <React.StrictMode>
    <App />
-  </BrowserRouter>,
+  </React.StrictMode>,
  document.getElementById('root')
 );
Author	SHA1	Message	Date
Hansi Xu	0a1323da8a	Finally fixed input	2022-03-06 18:15:21 -05:00
Hansi Xu	7e17e1c9e9	Adding profile pics for phase1 (hard coded contacts)	2022-03-06 16:22:26 -05:00
Hansi Xu	ab80301f31	Adding chat components	2022-03-06 15:57:04 -05:00
Hansi Xu	c332594b40	Revert "The chat component" This reverts commit `fa8c2e7cf9`.	2022-03-06 15:53:19 -05:00
Hansi Xu	fa8c2e7cf9	The chat component	2022-03-06 15:40:56 -05:00