diff --git a/src/App.js b/src/App.js index d00cb09..3baebe1 100644 --- a/src/App.js +++ b/src/App.js @@ -1,68 +1,140 @@ -import { BrowserRouter, Routes, Route } from 'react-router-dom'; -import EmailVerify from './component/Authentication/EmailVerify/emailVerify'; -import ForgotPwd from './component/Authentication/ForgotPassword/forgotPwd'; -import Login from './component/Authentication/Login/login'; -import AuthOtp from './component/Authentication/OTP/otp'; -import ResetPwd from './component/Authentication/ResetPassword/resetPwd'; -import SignUp from './component/Authentication/SignUp/signUp'; -import Error from './component/Assets/Error404/Error'; -import SignUpTwo from './component/Authentication/SignUpTwo/SignUpTwo'; -import Sidebar from './component/Sidebar/SideBar'; -import HomePage from './component/Home Page/homePage'; -import CreateTweet from './component/Home Page/createTweet'; -import Bookmarks from './component/Bookmarks/bookmarks'; -import ProfilePage from './component/Profile/profilePage'; -import EditProfile from './component/Profile/EditProfile'; -import LogOut from './component/logOut/logOut'; -import Google from "./component/Authentication/GoogleSign/Google" -import TagTweets from './component/Sidebar/TagTweets'; -import OneTweet from './component/Reply/OneTweet'; -import GoogleSignin from './component/Authentication/GoogleSign/GoogleSignIn'; -import Messages1 from './component/Messages/Messages1'; -import Chats from './component/Messages/Chats'; -import PrivateRoute from './component/PrivateRoute'; -import PhoneSearch from './component/Sidebar/PhoneSearch'; -import Notifications from './component/Notification/Notification'; -import AuthHome from './component/Authentication/AuthHome'; -import NotifTweet from './component/Notification/NotifTweet'; -import './App.css'; +import { BrowserRouter, Routes, Route } from "react-router-dom"; +import EmailVerify from "./component/Authentication/EmailVerify/emailVerify"; +import ForgotPwd from "./component/Authentication/ForgotPassword/forgotPwd"; +import Login from "./component/Authentication/Login/login"; +import AuthOtp from "./component/Authentication/OTP/otp"; +import ResetPwd from "./component/Authentication/ResetPassword/resetPwd"; +import SignUp from "./component/Authentication/SignUp/signUp"; +import Error from "./component/Assets/Error404/Error"; +import SignUpTwo from "./component/Authentication/SignUpTwo/SignUpTwo"; +import Sidebar from "./component/Sidebar/SideBar"; +import HomePage from "./component/Home Page/homePage"; +import Bookmarks from "./component/Bookmarks/bookmarks"; +import ProfilePage from "./component/Profile/profilePage"; +import EditProfile from "./component/Profile/EditProfile"; +import LogOut from "./component/logOut/logOut"; +import Google from "./component/Authentication/GoogleSign/Google"; +import TagTweets from "./component/Sidebar/TagTweets"; +import OneTweet from "./component/Reply/OneTweet"; +import GoogleSignin from "./component/Authentication/GoogleSign/GoogleSignIn"; +import Messages1 from "./component/Messages/Messages1"; +import Chats from "./component/Messages/Chats"; +import PhoneSearch from "./component/Sidebar/PhoneSearch"; +import Notifications from "./component/Notification/Notification"; +import NotifTweet from "./component/Notification/NotifTweet"; +import PrivateRoute from "./component/PrivateRoute"; +import "./App.css"; function App() { + return ( + <> + + + } /> + } /> + } /> + } /> + } /> + } /> + } /> + } /> + } /> - const isUser = localStorage.getItem("access token") ? true : false; - return <> - - - {/* {isUser?():(} />)} */} - } /> - } /> - } /> - } /> - } /> - } /> - } /> - } /> - } /> - {/* } /> */} - - {/* {isUser ? ( } />) : (} />)} */} - {isUser ? (} />) : (} />)} - {isUser ? (} />) : (} />)} - {isUser ? (} />) : (} />)} - {isUser ? (} />) : (} />)} - {isUser ? (} />) : (} />)} - {isUser ? (} />) : (} />)} - {isUser ? (} />) : (} />)} - {isUser ? (} />) : (} />)} - {isUser ? (} />) : (} />)} - {isUser ? (} />) : (} />)} - {isUser ? (} />) : (} />)} - } /> - } /> - {/* } /> */} - - - + + + + } + /> + + + + } + /> + + + + } + /> + + + + } + /> + + + + } + /> + + + + } + /> + + + + } + /> + + + + } + /> + + + + } + /> + + + + } + /> + + + + } + /> + } /> + } /> + } /> + + + + ); } export default App; diff --git a/src/component/Assets/Loader.jsx b/src/component/Assets/Loader.jsx index 83e71d8..68a294f 100644 --- a/src/component/Assets/Loader.jsx +++ b/src/component/Assets/Loader.jsx @@ -1,16 +1,22 @@ -import React, { useEffect } from 'react' -import { Spinner } from 'react-bootstrap'; +import React, { useEffect } from "react"; +import { Spinner } from "react-bootstrap"; -const Loader = (props) => { - - return <> - - -} +const Loader = ({ time, loading }) => { + return ( + <> + + + ); +}; -export default Loader \ No newline at end of file +export default Loader; diff --git a/src/component/Authentication/Login/login.jsx b/src/component/Authentication/Login/login.jsx index c37efb1..42e7ce1 100644 --- a/src/component/Authentication/Login/login.jsx +++ b/src/component/Authentication/Login/login.jsx @@ -72,13 +72,24 @@ function Login() { } }, [error, showErr, loading]); + const [loadTime, setLoadTime] = useState(10); + useEffect(()=>{ + if(loading){ + const time = loadTime >0 && setInterval(()=>{ + setLoadTime((time)=> time-1); + },1000) + + return ()=> clearInterval(time) + } + }, [loading, loadTime]) + useEffect(() => { - if (loading === true || loadingGoogle === true) { - document.body.style.opacity = 0.5; - } else { - document.body.style.opacity = 1; - } - }, [loading, loadingGoogle]); + if (loadTime>0 && (loading === true || loadingGoogle === true)) { + document.body.style.opacity = 0.5; + } else { + document.body.style.opacity = 1; + } + }, [loading, loadingGoogle, loadTime]); useEffect(() => { if (toFgtPwd && bool) { @@ -101,11 +112,14 @@ function Login() { } }, [googleRed]); - const isUser = localStorage.getItem("access token") ? true : false; - - useEffect(() => { - if (isUser) navigate("/"); - }, [isUser]); + const accessToken = localStorage.getItem("access token"); + const isUser = accessToken ? true : false; + + useEffect(() => { + if (isUser) { + navigate("/"); + } + }, [isUser]); return ( <> @@ -168,7 +182,7 @@ function Login() {

- {loading === true || loadingGoogle === true ? ( + {loadTime>0 && (loading === true || loadingGoogle === true) ? ( ) : null} diff --git a/src/component/Home Page/TweetComp.jsx b/src/component/Home Page/TweetComp.jsx index 17498b5..911b9f0 100644 --- a/src/component/Home Page/TweetComp.jsx +++ b/src/component/Home Page/TweetComp.jsx @@ -36,7 +36,6 @@ function Tweet(props) { const { tweetData } = useSelector((s) => s.TweetFeedReducer) useEffect(() => { if (localStorage.getItem('idx')==props.number) { - console.log("hi"); const index = localStorage.getItem('idx'); setReplyCount(replyCount+1); localStorage.removeItem('idx') diff --git a/src/component/Home Page/createTweet.jsx b/src/component/Home Page/createTweet.jsx index 0510559..f9a9279 100644 --- a/src/component/Home Page/createTweet.jsx +++ b/src/component/Home Page/createTweet.jsx @@ -71,7 +71,6 @@ function CreateTweet(props) { function handleSendVideo(e) { // var videooutput = document.getElementById("videoOutput"); // videooutput.src = URL.createObjectURL(e.target.files[0]) - console.log("---->"); setVdoInArr(URL.createObjectURL(e.target.files[0])); setSendVideo(e.target.files[0]); diff --git a/src/component/Home Page/homePage.jsx b/src/component/Home Page/homePage.jsx index b785f5d..4ad3c5d 100644 --- a/src/component/Home Page/homePage.jsx +++ b/src/component/Home Page/homePage.jsx @@ -18,11 +18,27 @@ function HomePage() { const { loading, tweetData, liked, bookmarked, privateRoute, trendingTweet } = useSelector((s) => s.TweetFeedReducer) const [tweeets, settweets] = useState([]) const navigate = useNavigate() - const isUser = localStorage.getItem("access token") ? true : false; - useEffect(()=>{ - if(!isUser) - navigate("/login") - },[isUser]) + + // access token + // const [token, setToken]= useState(null) + // async function getValue() { + // const x = await localStorage.getItem("access token"); + // console.log(x) + // setToken(x) + // } + + // useEffect(()=>{ + // getValue(); + // },[]) + + const accessToken = localStorage.getItem("access token"); + const isUser = accessToken ? true : false; + + useEffect(() => { + if (!isUser) { + navigate("/login"); + } + }, [isUser]); const { response } = useSelector((t) => t.TweetCreateReducer) useEffect(() => { @@ -42,7 +58,6 @@ function HomePage() { const [count, setCount] = useState(1) function handleShowMoreTweet() { - // dispatch(TweetFeedCount()) setCount(count+1) dispatch(TweetFeedAction2(count)) } @@ -55,14 +70,25 @@ function HomePage() { } } + const [loadTime, setLoadTime] = useState(2); + useEffect(()=>{ + if(loading){ + const time = loadTime >0 && setInterval(()=>{ + setLoadTime((time)=> time-1); + },1000) + + return ()=> clearInterval(time) + } + }, [loading, loadTime]) + useEffect(() => { if (loading === true) { - document.body.style.opacity = 0.5; + document.body.style.opacity = 0.5; + } else { + document.body.style.opacity = 1; } - else { - document.body.style.opacity = 1; - } - }, [loading]) + }, [loading]); + return <>
@@ -89,7 +115,7 @@ function HomePage() { })) : null}
- {(loading === true) ? : null} + {(loading === true) ? : null} } diff --git a/src/component/Messages/Chats.jsx b/src/component/Messages/Chats.jsx index 5e757d3..b8467c7 100644 --- a/src/component/Messages/Chats.jsx +++ b/src/component/Messages/Chats.jsx @@ -215,7 +215,6 @@ function Chats() { } }, [loading]); const navigate = useNavigate(); - console.log("Top pic ", topPic); return ( <> diff --git a/src/component/PrivateRoute.jsx b/src/component/PrivateRoute.jsx index 100251e..1a50e76 100644 --- a/src/component/PrivateRoute.jsx +++ b/src/component/PrivateRoute.jsx @@ -1,13 +1,35 @@ -import React, { Children } from "react"; +import React, { useEffect, useState } from "react"; +import { Route, Routes, useNavigate } from "react-router-dom"; +import Error from "./Assets/Error404/Error"; -import {Route, useAsyncValue, useNavigate} from "react-router-dom"; -import { redirect } from "react-router-dom"; +const PrivateRoute = (props) => { + const navigate = useNavigate(); -const PrivateRoute=({children , ...rest})=>{ - const navigate = useNavigate() - const isUser = sessionStorage.getItem("access token")?true:false; + const [isLoggedIn, setIsLoggedIn] = useState(false); + const checkUserToken = () => { + const userToken = localStorage.getItem("access token"); + if (!userToken || userToken === undefined || userToken == null) { + setIsLoggedIn(false); + return navigate("/"); + } + setIsLoggedIn(true); + }; - return (isUser?(children):(navigate("/"))} />) -} + console.log(isLoggedIn); + useEffect(() => { + checkUserToken(); + }, [isLoggedIn]); + return ( + <> + {isLoggedIn ? ( + props.children + ) : ( + + } /> + + )} + + ); +}; -export default PrivateRoute \ No newline at end of file +export default PrivateRoute; diff --git a/src/component/Sidebar/TagTweets.jsx b/src/component/Sidebar/TagTweets.jsx index 19d1d79..2a38e12 100644 --- a/src/component/Sidebar/TagTweets.jsx +++ b/src/component/Sidebar/TagTweets.jsx @@ -14,16 +14,13 @@ const dispatch = useDispatch() useEffect(()=>{ dispatch(TagtweetNav(navTweet, `${tagTweets.tag}`)) if (getTag) { - setTitle(tagTweets.tag) - setTweetArr(tagTweets.tweets) } },[getTag, tagTweets]) - useEffect(()=>{ - if(loading===true){ + if(loading){ document.body.style.opacity = 0.5; } else{ diff --git a/src/component/counter.jsx b/src/component/counter.jsx index 4772ec8..35fb095 100644 --- a/src/component/counter.jsx +++ b/src/component/counter.jsx @@ -17,19 +17,12 @@ const Counter = () => { if(count==0) setcount(59) else{ - // console.warn(count) let newcount=count-1; - // console.log(newcount) - // console.log(count-1) setcount(newcount) } },1000) - // setInterval(()=>{ - // console.warn("Set interval") - // },1000) setTimeout(()=>{ - // console.log("Set timeout") },1000) return (
counter {count}
diff --git a/src/index.js b/src/index.js index bd2ad8f..7b4a080 100644 --- a/src/index.js +++ b/src/index.js @@ -3,13 +3,12 @@ import ReactDOM from 'react-dom/client'; import './index.css'; import App from './App'; import reportWebVitals from './reportWebVitals'; -// import store from './redux/app/store'; import store from './react-redux/Store'; import { Provider } from 'react-redux'; import { PersistGate } from 'redux-persist/es/integration/react'; import { persiststore } from './react-redux/Store'; -store.subscribe(()=>console.log(store.getState())) +// store.subscribe(()=>console.log(store.getState())) const root = ReactDOM.createRoot(document.getElementById('root')); root.render( diff --git a/src/react-redux/Store.jsx b/src/react-redux/Store.jsx index 6cdfb65..bf84dc9 100644 --- a/src/react-redux/Store.jsx +++ b/src/react-redux/Store.jsx @@ -9,7 +9,8 @@ import rootReducer from "./reducers"; const composeEnhancers = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose; const persistconfig ={ key:"root", - storage: localStorage + storage: localStorage, + blacklist: ['TweetFeedReducer'] } const persistreducer = persistReducer(persistconfig, rootReducer) diff --git a/src/react-redux/actions/Tweets.jsx b/src/react-redux/actions/Tweets.jsx index 01d6171..18715dd 100644 --- a/src/react-redux/actions/Tweets.jsx +++ b/src/react-redux/actions/Tweets.jsx @@ -231,8 +231,8 @@ const TweetListWithTag = (tag) => { dispatch({ type: "TAG_TWEET_LIST_FAILED", payload: err - }) }) + }) } } diff --git a/src/react-redux/actions/authAction.jsx b/src/react-redux/actions/authAction.jsx index 619221b..ce3d38d 100644 --- a/src/react-redux/actions/authAction.jsx +++ b/src/react-redux/actions/authAction.jsx @@ -26,7 +26,6 @@ export default LogInUser const FgtPwdAction = (email, condition) => { return async function (dispatch) { if (condition) { - console.log(email) dispatch({ type: "FGT_EMAIL_STARTED" }) await BaseUrl.post(`/forgotpwd`, { email }) .then((res) => dispatch({ @@ -142,7 +141,6 @@ export { SignUpResend } const SignUpTwoUser = (data) => { const accessToken = localStorage.getItem("access token") - console.log(accessToken) const config = { headers: { "Authorization": `Bearer ${accessToken}` @@ -169,7 +167,6 @@ export { SignUpTwoUser } const ResetAction = (password) => { const accessToken = localStorage.getItem("otp token") - console.log(accessToken) const config = { headers: { "Authorization": `Bearer ${accessToken}` @@ -197,7 +194,6 @@ const GoogleAction = () => { dispatch({ type: "GOOGLE_STARTED" }) await BaseUrl.get(`/auth/google/url`) .then((res) => { - console.log(res) dispatch({ type: "GOOGLE_SUCCEDED", payload: res.data @@ -205,7 +201,6 @@ const GoogleAction = () => { }) .catch((err) => { - console.log(err) }) } @@ -221,7 +216,6 @@ const GoogleTwoAction = (url) => { payload: res })) .catch((err) => { - console.log(err) dispatch({ type: "GOOGLE_TWO_FAILED", payload: err diff --git a/src/react-redux/reducers/GoogleReducer.jsx b/src/react-redux/reducers/GoogleReducer.jsx index 6f69dc0..5638ac5 100644 --- a/src/react-redux/reducers/GoogleReducer.jsx +++ b/src/react-redux/reducers/GoogleReducer.jsx @@ -16,12 +16,12 @@ const GoogleReducer =(state=initialState, action)=>{ case "GOOGLE_TWO_STARTED":return { ...state } - case "GOOGLE_TWO_SUCCEDED":{console.log(action.payload.data.token) + case "GOOGLE_TWO_SUCCEDED":{ localStorage.setItem("access token", action.payload.data.token) return { ...state, response2:action.payload.data,mark:true, error2:"" }} - case "GOOGLE_TWO_FAILED":{console.log(action.payload) + case "GOOGLE_TWO_FAILED":{ return { ...state, error2:action.payload, response2:"", mark:false }} diff --git a/src/react-redux/reducers/TagTweetReducer.jsx b/src/react-redux/reducers/TagTweetReducer.jsx index 6c7f221..fe773ae 100644 --- a/src/react-redux/reducers/TagTweetReducer.jsx +++ b/src/react-redux/reducers/TagTweetReducer.jsx @@ -9,7 +9,7 @@ const initialState={ export const TagTweetFeedReducer = (state=initialState, action)=>{ switch(action.type){ case "TAG_TWEET_LIST_START":{ - return {...state, loading:true} + return {...state, loading:true } } case "TAG_TWEET_LIST_SUCCEDED":{ return {...state, loading:false, tagTweets:action.payload.data, getTag:true} diff --git a/src/redux/features/SignIn/SignInSlice.jsx b/src/redux/features/SignIn/SignInSlice.jsx index 4edf154..a338eda 100644 --- a/src/redux/features/SignIn/SignInSlice.jsx +++ b/src/redux/features/SignIn/SignInSlice.jsx @@ -11,7 +11,6 @@ const initialState={ //action const SignInUser = createAsyncThunk("login/SignInUser",(data)=>{ // if(isAuthEmail){ - // console.log(isAuthEmail) const api = axios.post("https://twitterbackend-production-93ac.up.railway.app/login",data) // .then((res)=>{ // return res; @@ -30,12 +29,9 @@ const loginSlice = createSlice({ initialState, extraReducers:(builder)=>{ builder.addCase(SignInUser.pending, (state, action)=>{ - console.log(action) state.loading = true }) builder.addCase(SignInUser.fulfilled, function(state, action){ - console.log(action) - console.log(action.payload) return ( state.loading = false, state.response = action.payload.data.msg, @@ -44,8 +40,6 @@ const loginSlice = createSlice({ // return state; }) builder.addCase(SignInUser.rejected,(state,action)=>{ - console.log(action) - // console.log(action.payload) return ( state.loading = false, state.response = "",