Update Main.js

src/App.js

@@ -22,4 +22,12 @@ function App() {
   );
 }
 
-export default App;
+const mapStateToProps = (state)=>{
+  return{};
+};
+const mapDispatchToProps=(dispatch)=>({
+  getUserAuth: ()=>dispatch(getUserAuth()),
+});
+
+export default connect(mapStateToProps, mapDispatchToProps)(App);
+

src/actions/actionType.js

@@ -0,0 +1,3 @@
+export const SET_USER ='SET_USER';
+export const SET_LOADING_STATUS ='SET_LOADING_STATUS';
+export const GET_ARTICLES ='GET_ARTICLES';

src/actions/index.js

@@ -0,0 +1,109 @@
+import {auth,provider,storage} from "../firebase";
+import {SET_USER, SET_LOADING_STATUS, GET_ARTICLES} from "../actions/actionType";
+import db from "../firebase";
+
+
+export const setUser = (payload) =>({
+    type: SET_USER,
+    user:payload,
+});
+export const setLoading =(status) =>({
+    type: SET_LOADING_STATUS,
+    status:status,
+});
+
+export const getArticles=(payload) =>({
+    type: GET_ARTICLES,
+    payload:payload,
+})
+
+export function signInAPI(){
+    return(dispatch)=>{
+        auth.signInWithPopup(provider)
+        .then((payload) =>{
+            dispatch(setUser(payload.user));
+        })
+        .catch((error) => alert(error.message));
+    };
+}
+
+export function getUserAuth(){
+    return(dispatch)=>{
+        auth.onAuthStateChanged(async(user)=>{
+            if(user){
+                dispatch(setUser(user));
+            }
+        })
+    }
+}
+export function signOutAPI() {
+    return (dispatch) => {
+        auth.signOut().then(()=>{
+            dispatch(setUser(null));
+        }).catch(error => alert(error.message));
+    };
+}
+
+export function postArticleAPI(payload){
+    return (dispatch) => {
+        dispatch(setLoading(true));
+        if(payload.image !="") {
+            const upload= storage
+            .ref('image/${payload.image.name}')
+            .put(payload.image);
+            upload.on(
+                'state_Changed',(snapshot) => {
+                const progress= (snapshot.bytesTransferred/ snapshot.totalBytes)*100;
+                console.log('Progress: ${progress}%');
+                if(snapshot.state === "RUNNING"){
+                    console.log('Progress: ${progress}%');
+                }
+            },
+            (error) => console.log(error.code),
+            async () =>{
+                const downloadURL = await upload.snapshot.ref.getDownloadURL();
+                db.collection("articles").add({
+                    actor:{ 
+                       description:payload.user.email,
+                       title:payload.user.displayName,
+                       date:payload.timestamp,
+                       image:payload.user.photoURL, 
+                    },
+                    video:payload.video,
+                    sharedImg: downloadURL,
+                    comment:0,
+                    description:payload.description,
+                });
+                dispatch(setLoading(false));
+            }
+            );
+        } else if (payload.video){
+            db.collection("articles").add({
+                actor:{
+                    description:payload.user.email,
+                    title: payload.user.displayName,
+                    date: payload.timestamp,
+                    image: payload.user.photoURL, 
+                 },
+                 video:payload.video,
+                 sharedImg:" ",
+                 comment:0,
+                 description:payload.description,
+            });
+            dispatch(setLoading(false));
+        }
+    };
+
+}
+export function getArticlesAPI(){
+    return(dispatch)=>{
+        let payload;
+
+        db.collection("articles")
+        .orderBy("actor.date","desc")
+        .onSnapshot((snapshot)=>{
+            payload = snapshot.docs.map((doc)=>doc.data());
+            dispatch(getArticles(payload));
+        });
+    }
+}