// import { Posts } from "../../dummyData";
import "./feed.css";
import Post from "../post/Post";
import Share from "../share/Share";
import axios from "axios";
import { AuthContext } from "../../context/AuthContext";
import { useEffect, useState, useContext } from "react";

export default function Feed({ username }) {
  const [posts, setPosts] = useState([]);
  const { user } = useContext(AuthContext);

  useEffect(() => {
    const fetchPosts = async () => {
      const res = username
        ? await axios.get("/posts/profile/" + username)
        : await axios.get("posts/timeline/" + user._id);
      setPosts(res.data);
    };
    fetchPosts();
  }, [username, user._id]);

  return (
    <div className="feed">
      <div className="feedWrapper">
        <Share />
        {posts.map((p) => (
          <Post key={p._id} post={p} />
        ))}
      </div>
    </div>
  );
}

import React from 'react';

import { CloseFriend } from './CloseFriend';

export default {
  title: 'Example/CloseFriend',
  component: CloseFriend,
};

const Template = (args) => <CloseFriend {...args} />;

export const LoggedIn = Template.bind({});
LoggedIn.args = {
  user: {},
};

export const LoggedOut = Template.bind({});
LoggedOut.args = {};

import axios from "axios";
import { useRef } from "react";
import { useHistory } from "react-router";
import "./register.css";

export default function Register() {
  const username = useRef();
  const email = useRef();
  const password = useRef();
  const passwordAgain = useRef();
  const history = useHistory();

  const handleClick = async (e) => {
    e.preventDefault();
    // console.log(email.current.value);
    if (passwordAgain.current.value !== password.current.value) {
      passwordAgain.current.setCustomValidity('PassWords do not Match');
    } else {
      const user = {
        username: username.current.value,
        email: email.current.value,
        password: password.current.value,
      };
      try {
        await axios.post("/auth/register", user);
        history.push("/login");
      } catch (err) {
        console.log(err);
      }
    }
  };
  return (
    <div className="login">
      <div className="loginWrapper">
        <div className="loginLeft">
          <h3 className="loginLogo">geoLARP</h3>
          <span className="loginDesc">
            GeoLocated
          </span>
          <span className="loginDesc">
            Live Action Role Playing
          </span>
        </div>
        <div className="loginRight">
          <form className="loginBox" onSubmit={handleClick} >
            <input
              placeholder="Username"
              required
              className="loginInput"
              ref={username}
            />
            <input
              placeholder="please use a disposable Email"
              type='email'
              required
              className="loginInput"
              ref={email}
            />
            <input
              placeholder="Password"
              type='password'
              required
              minLength="6"
              className="loginInput"
              ref={password}
            />
            <input
              placeholder="Password Again"
              type='password'
              required
              className="loginInput"
              ref={passwordAgain}
            />
            <button className="loginButton" type='submit' >Sign Up</button>
            <button className="loginRegisterButton">
              Log into Account
            </button>
          </form>
        </div>
      </div>
    </div>
  );
}

const router = require('express').Router();
const User = require('../models/User');
const bcrypt = require('bcrypt');

// REGISTER
router.post('/register', async (req, res) => {

  try {
    // generate a salty password
    const salt = await bcrypt.genSalt(10);
    const hashedPassword = await bcrypt.hash(req.body.password, salt);

    // create a new user
    const newUser = new User({
      username: req.body.username,
      email: req.body.email,
      password: hashedPassword,
    });

    // save the user and respond
    const user = await newUser.save();
    console.log(user);
    res.status(200)
      // .json({ message: 'Registered User with API AUTH Route', user: user._id });
      .json(user);
  } catch (err) {
    res.status(500).json(err);
  }

}); // GET /api/auth


// LOGIN
router.post('/login', async (req, res) => {
  try {
    // find the user
    const user = await User.findOne({ email: req.body.email });

    // check if the user exists
    !user && res.status(404).json('User not found');


    // check if the password is correct
    const validPassword = await bcrypt.compare(req.body.password, user.password);
    !validPassword && res.status(400).json('Invalid Password');

    // respond with the user
    res.status(200).json(user);
  } catch (err) {
    res.status(500).json(err);
  }
}); // GET /api/auth/login

module.exports = router;
// export default router;