@@ -17,7 +23,7 @@ const LoginScreen=()=>{
{/* onClick={()=>setInactive(true)} */}
{signIn ? (
@@ -32,7 +38,7 @@ const LoginScreen=()=>{
diff --git a/netflix/src/components/screen/profileScreen.css b/netflix/src/components/screen/profileScreen.css
index 45fafb7..c9b6433 100644
--- a/netflix/src/components/screen/profileScreen.css
+++ b/netflix/src/components/screen/profileScreen.css
@@ -1,4 +1,62 @@
-.profileScreen{
- /* background-color: #000;
- color: #fff; */
+.profileScreen__body{
+ padding-top: 3rem;
+ background-color: #111;
+ color: #fff;
+ height: 100vh;
+}
+
+.profileScreen__info{
+ display: flex;
+ flex-wrap: wrap;
+ justify-content:center;
+ align-items:center;
+ /* padding-top: 5rem; */
+
+}
+
+.profileScreen__body h2{
+ text-align: center;
+ padding-top: 2rem;
+ padding-bottom: 2rem;
+}
+.profileScreen__body img{
+ object-fit: contain;
+ height: 40px;
+ /* text-align: center; */
+ /* justify-content: center;
+ display: flex; */
+ border-radius: 3rem;
+}
+
+.profileScreen__body h5{
+ padding: 1rem;
+ margin-left: 2rem;
+ color: #fff;
+ border: none;
+ background-color: #222;
+ font-weight: 600;
+ /* border-radius: 0.2rem; */
+ text-align: center;
+ cursor: pointer;
+
+}
+
+.btn{
+ display: flex;
+ justify-content: center;
+ align-items: center;
+}
+
+.btn-signout{
+ padding: 1rem;
+ width: 50%;
+ margin-top: 2rem;
+ color: #fff;
+ border: none;
+ background-color: #e50519;
+ font-weight: 600;
+ font-size: 1rem;
+ border-radius: 0.2rem;
+ /* width: 300px; */
+ cursor: pointer;
}
\ No newline at end of file
diff --git a/netflix/src/components/screen/profileScreen.js b/netflix/src/components/screen/profileScreen.js
index 5d517e0..28ffd94 100644
--- a/netflix/src/components/screen/profileScreen.js
+++ b/netflix/src/components/screen/profileScreen.js
@@ -3,26 +3,38 @@ import './profileScreen.css'
import Navbar from '../Navbar'
import avatar from '../../asses/avatar.png';
import { useSelector } from 'react-redux';
+import { useNavigate } from 'react-router-dom';
import { selectUser } from '../../features/user/userSlice';
-import {getAuth} from 'firebase/auth'
+import {auth} from '../../firebase'
// import { useRef } from 'react';
// import { FirebaseError } from 'firebase/app';
-import auth from '../../App'
+// import auth from '../../App'
const ProfileScreen=() =>{
const user = useSelector(selectUser);
- const auth = getAuth()
+ // const auth = getAuth()Sign Out
+ const nav = useNavigate()
+
+ const handleLogout = async ()=>{
+ await auth.signOut()
+ nav("/")
+ }
return (
-
-
-
-
Edit in profile
+
+
+
+
Sign Out
+
-
hi {user}
+
{user.email}
+
+
-
+
+
)
diff --git a/netflix/src/components/screen/signUpScreen.js b/netflix/src/components/screen/signUpScreen.js
index 3a5476f..53ffccd 100644
--- a/netflix/src/components/screen/signUpScreen.js
+++ b/netflix/src/components/screen/signUpScreen.js
@@ -1,5 +1,6 @@
import React,{useRef,useEffect} from 'react'
-import { app } from '../../firebase'
+import {auth} from '../../firebase'
+import { useNavigate } from 'react-router-dom'
import {getAuth,createUserWithEmailAndPassword,signInWithEmailAndPassword} from 'firebase/auth'
import './signUpScreen.css'
@@ -7,7 +8,7 @@ import './signUpScreen.css'
const SignUpScreen= ()=>{
const emailRef = useRef(null)
const passwordRef= useRef(null)
-
+ const nav = useNavigate()
// useEffect(()=>{
// console.log(Object.keys(emailRef).current)
@@ -15,29 +16,31 @@ const SignUpScreen= ()=>{
// emailRef.current?.focus()
// }
// },[emailRef])
- const auth = getAuth();
- const register = (e)=>{
+
+ const register = async (e)=>{
e.preventDefault()
- createUserWithEmailAndPassword(auth,
+ await auth.createUserWithEmailAndPassword(
emailRef.current.value,
passwordRef.current.value
).then(authUser=>{
console.log(authUser)
+ nav("/home")
}).catch(error =>{
alert(error.message)
})
}
- const signIn = (e)=>{
+ const signIn = async (e)=>{
e.preventDefault()
- signInWithEmailAndPassword(auth,
+ await auth.signInWithEmailAndPassword(
emailRef.current.value,
passwordRef.current.value
).then((authUser)=>{
console.log(authUser)
+ nav("/home")
}).catch((error)=>{
alert(error.message)
})
diff --git a/netflix/src/firebase.js b/netflix/src/firebase.js
index 8efe47b..f404b34 100644
--- a/netflix/src/firebase.js
+++ b/netflix/src/firebase.js
@@ -1,4 +1,4 @@
-import {initializeApp} from 'firebase/app'
+import firebase from 'firebase'
const firebaseConfig = {
apiKey: "AIzaSyCY5xbrwK7uIDN11QDh7HjFpdR4e_nbWEA",
@@ -10,4 +10,9 @@ const firebaseConfig = {
measurementId: "G-9KEVFDH0GH"
};
-export const app = initializeApp(firebaseConfig)
\ No newline at end of file
+const firebaseApp = firebase.initializeApp(firebaseConfig)
+const db = firebaseApp.firestore()
+const auth = firebase.auth()
+
+export {auth};
+export default db;
\ No newline at end of file