Add editPostWatcher

src/actions/index.js

@@ -223,8 +223,7 @@ export const actionAvatar = (imageId, myId) =>
     ),
   )
 
-export const actionPostUpsert = (post, _id) => async (dispatch) => {
-  await dispatch(
+export const actionPostUpsert = (post, postId) => 
     actionPromise(
       'postUpsert',
       gql(
@@ -237,15 +236,12 @@ mutation PostUpsert($post:PostInput){
         {
           post: {
             ...post,
-            _id: _id,
+            _id:postId,
             images: post.images.map(({ _id }) => ({ _id })),
           },
         },
       ),
-    ),
-  )
-}
-
+    )
 export const actionAllPosts = (userId) =>
   actionPromise(
     'allPostsMe',

src/components/Comment.js

@@ -10,18 +10,11 @@ import { Link } from 'react-router-dom'
 import { Input, Button } from 'antd'
 import { SmileOutlined } from '@ant-design/icons'
 import moment from 'moment'
-import React, { useRef, useEffect, useState } from 'react'
+import React, { useState } from 'react'
 import 'emoji-mart/css/emoji-mart.css'
 import { Picker } from 'emoji-mart'
-import data from 'emoji-mart/data/google.json'
-import { NimblePicker, Emoji } from 'emoji-mart'
-import { LinkToUser } from './LinkToUser'
-import reactStringReplace from 'react-string-replace'
 import {  Comment,Avatar } from 'antd';
 import user from '../materials/user.png'
-// import EmojiSelector from 'react-native-emoji-selector'
-// render(<EmojiPicker onEmojiSelect={console.log} />, document.querySelector('#picker'))
-import { ConstructorModal } from '../helpers'
 
 export const AddComment = ({ addComment, postId }) => {
   const [text, setComment] = useState('')

src/components/Routing.js

@@ -2,7 +2,7 @@ import { InputForm, CRegisterForm, CLoginForm } from './LoginRegisterLogout'
 import { Router, Route, Redirect, Switch } from 'react-router-dom'
 import { CExplorePosts } from '../pages/explorePosts'
 import { CPostForFeed, Feed } from '../pages/feedPosts'
-import { CPostEditor } from '../pages/createAndEditPost'
+import { CPostEditor,CPostCreator } from '../pages/createAndEditPost'
 import { CPageAboutUser } from '../pages/profilePage'
 import { CPost } from '../pages/onePost'
 import { Provider, connect } from 'react-redux'
@@ -15,6 +15,8 @@ const Routing = ({ token }) => {
           <Route path="/profile/:_id" component={CPageAboutUser} />
           <Route path="/explore" component={CExplorePosts} />
           <Route path="/edit/post/:_id" component={CPostEditor} />
+          <Route path="/edit/post/new" component={CPostCreator} />
+
           <Route path="/post/:_id" component={CPost} />
           <Route path="/feed" component={CPostForFeed} />
           <Redirect from="/*" to="/feed" />

src/pages/createAndEditPost/index.js

@@ -19,46 +19,43 @@ import { arrayMoveImmutable } from 'array-move'
 import { Row, Col } from 'antd'
 import { history } from '../../helpers'
 import { Input } from '../../components/Input'
+import {actionCreateEditPost} from '../../redux/saga'
+
 const PostEditor = ({
   match: {
     params: { _id },
   },
   myId,
-  post = {},
   onSave,
   onFileDrop,
+  post={},
   fileStatus,
   clearPostOne,
   clearPromise,
 }) => {
+  console.log('post in start component', post)
   post = {
     _id: post?._id || '',
     title: post?.title || '',
     text: post?.text || '',
     images: post?.images || [],
   }
-
-  console.log('post ', post)
+  console.log('post after', post)
   console.log('post _id', _id)
   const [state, setState] = useState(post)
   useEffect(() => {
     if (_id === 'new' && Object.keys(post)) {
-      console.log('in condition')
       clearPostOne()
-      clearPromise('onePost')
-      if (post?._id?.length < 8) {
-        console.log('post with _id < 8', post)
-        post = {
-          _id: post?._id || '',
-          title: post?.title || '',
-          text: post?.text || '',
-          images: post?.images || [],
-        }
-        console.log('after post ', post)
-        console.log('update state', state)
-        return () => setState(post)
+      // clearPromise("onePost")
+      post = {
+        _id: post?._id || '',
+    title: post?.title || '',
+    text: post?.text || '',
+    images: post?.images || [],
       }
-
+      console.log('попало в иф айди нью ', _id)
+     return setState(post)
+ 
       //console.log('post after clear ', post)
     }
   }, [_id])
@@ -100,20 +97,20 @@ const PostEditor = ({
     })
   const disabledBtn =
     state?.images && state?.title && state?.text ? false : true
-
+  console.log('STATEEE IDDDD', state?._id)
   const savePost = () =>
-    onSave(state, state?._id) &&
+    onSave(state) &&
     message.success(`Post published success!`) &&
     history.push(`/profile/${myId}`)
-  useEffect(() => {
-    return () => {
-      clearPromise('uploadFiles')
-      clearPromise('postUpsert')
-      clearPromise('post')
-      clearPostOne()
-      clearPromise('onePost')
-    }
-  }, [])
+  // useEffect(() => {
+  //   return () => {
+  //     clearPromise('uploadFiles')
+  //     clearPromise('postUpsert')
+  //     clearPromise('post')
+  //     clearPostOne()
+  //     clearPromise('onePost')
+  //   }
+  // }, [])
   const checkLength = () => {
     if (state?.images?.length > 8) {
       console.log('state?.images?.length', state?.images?.length)
@@ -134,8 +131,7 @@ const PostEditor = ({
          
               <SortableContainer
                 onSortEnd={onSortEnd}
-                style={{ with: '300px' }}
-              >
+                style={{ with: '300px' }} >
                 {state?.images?.length < 8 &&
                   (state?.images || []).map(({ _id, url }, index) => (
                     <SortableItem
@@ -189,16 +185,44 @@ const PostEditor = ({
   )
 }
 
-export const CPostEditor = connect(
+// export const CPostEditor = connect(
+//   (state) => ({
+//     fileStatus: state.promise?.uploadFiles,
+//     post: state?.post?.onePost,
+//     myId: state?.myData?.aboutMe?._id,
+//   }),
+//   {
+//     onSave: actionCreateEditPost,
+//     onFileDrop: actionUploadFiles,
+//     clearPostOne: actionClearOnePostType,
+//     // clearPromise: actionClearPromise,
+//   },
+// )(PostEditor)
+
+export const CPostCreator = connect(
   (state) => ({
     fileStatus: state.promise?.uploadFiles,
-    post: state?.post?.onePost,
+    // post: state?.post?.onePost,
     myId: state?.myData?.aboutMe?._id,
   }),
   {
-    onSave: actionPostUpsert,
+    onSave: actionCreateEditPost,
     onFileDrop: actionUploadFiles,
     clearPostOne: actionClearOnePostType,
     clearPromise: actionClearPromise,
   },
 )(PostEditor)
+
+export const CPostEditor = connect(
+  (state) => ({
+    fileStatus: state.promise?.uploadFiles,
+    post: state?.post?.onePost,
+    myId: state?.myData?.aboutMe?._id,
+  }),
+  {
+    onSave: actionCreateEditPost,
+    onFileDrop: actionUploadFiles,
+    clearPostOne: actionClearOnePostType,
+    // clearPromise: actionClearPromise,
+  },
+)(PostEditor)

src/pages/setting/index.js

@@ -29,8 +29,8 @@ const EditSetting = ({ info, myId, onSaveUserUpsert,
   const [changePass, setChangePass] = useState(changePassword)
     const [isModalVisibleEdit, setIsModalVisibleEdit] = useState(false);
     // actionChangePassword
-  console.log('all info ', info)
-  console.log('login ', info?.login)
+  // console.log('all info ', info)
+  // console.log('login ', info?.login)
   
     const showModalEdit = () => {
       setIsModalVisibleEdit(true);

src/redux/index.js

@@ -17,7 +17,8 @@ import {
 onePostWatcher,
   addCommentFeedWatcher,
   addCommentOnePostWatcher,
-  changeLikePostWatcher
+  changeLikePostWatcher,
+  editPostWatcher
 } from './saga'
 import createSagaMiddleware from 'redux-saga' //функция по созданию middleware
 import {
@@ -52,7 +53,8 @@ function* rootSaga() {
     exploreWatcher(),
     onePostWatcher(),
     addCommentOnePostWatcher(),
-    changeLikePostWatcher()
+    changeLikePostWatcher(),
+    editPostWatcher()
     // addCommentFeedWatcher()
   ])
 }

src/redux/saga/index.js

@@ -17,7 +17,8 @@ import {
   actionClearPromise,
   actionGetCommentsOnePost,
   actionFindLikes,
-
+  actionPostUpsert,
+  actionClearPromiseForName
   // actionOnePost
   } from '../../actions'
 import { history } from '../../helpers'
@@ -75,10 +76,10 @@ export const actionFullProfilePage = () =>
 
 function* fullProfilePageWorker() {
   const { auth } = yield select()
-  console.log('auth', auth)
+  // console.log('auth', auth)
   if (auth?.payload?.sub?.id) {
     const aboutMe = yield call(promiseWorker, actionAboutMe(auth?.payload?.sub.id))
-  console.log('aboutMe in worker', aboutMe)
+  // console.log('aboutMe in worker', aboutMe)
    
     if (aboutMe) {
       yield put(actionProfilePageDataType(aboutMe))
@@ -98,10 +99,10 @@ export const actionFullProfilePageUser = (_id) =>
   ({ type: "USER_PAGE", _id })
   
 function* fullPageAboutUserWorker({ _id }) {
-  console.log('_id ',  _id)
+  // console.log('_id ',  _id)
 
   const aboutUser = yield call(promiseWorker, actionAboutUser(_id))
-  console.log('about user',  aboutUser)
+  // console.log('about user',  aboutUser)
   const allPosts = yield call(promiseWorker, actionAllPostsUser(_id))
   const countPosts = yield call(promiseWorker, actionPostsCount(_id))
 
@@ -180,19 +181,7 @@ function* addCommentFeedWorker({ postId, newResult }) {
   if (comments)
     yield put(actionAddCommentPostInTape(postId, newResult))
   }
-  // const {
-  //   promise: {
-  //     addComment
-  //   }
-  // } = yield select()
-  // if (addComment?.status === 'FULFILLED') {
-  //   console.log('УРААА')
-  //   const onePost = yield call(promiseWorker, actionOnePost(postId))
-  //   if (onePost)
-  //   yield call(promiseWorker,actionAddCommentPostInTape(postId, newResult))
-  // }
-    
-// }
+
 export function* addCommentFeedWatcher() {
   yield takeLeading("ADD_COMMENT_FEED", addCommentFeedWorker)
   
@@ -228,10 +217,10 @@ yield takeLeading("ONE_POST",onePostWorker)
 //comment
 
 function* addCommentOnePostWorker({ postId, text }) {
-  console.log('post id', postId)
-  console.log('comment', text)
+  // console.log('post id', postId)
+  // console.log('comment', text)
   const add= yield call(promiseWorker, actionAddComment(postId, text))
-  console.log('add', add)
+  // console.log('add', add)
   const {
     promise: {
       addComment: { status },
@@ -240,7 +229,7 @@ function* addCommentOnePostWorker({ postId, text }) {
   if (status === 'FULFILLED') {
     yield call(promiseWorker, actionOnePost(postId))
     const { comments } = yield call(promiseWorker, actionGetCommentsOnePost(postId))
-   console.log('add comments', comments)
+  //  console.log('add comments', comments)
     if (comments)
       yield put (actionAddCommentType(comments))
   }
@@ -266,6 +255,7 @@ export function* addCommentOnePostWatcher(){
 //     }
 // }
 
+//change like in post
 export const actionChangeLike = (likeId, postId) =>
 ({
     type:"CHANGE_LIKE_POST", likeId,postId
@@ -300,7 +290,34 @@ export function* changeLikePostWatcher() {
   yield takeLeading("CHANGE_LIKE_POST", changeLikePostWorker)
 }
 
+// create and edit post
 
+function* editPostWorker({state }) {
+  
+  console.log('in worker default post', state)
+  console.log('in worker post id', state?._id)
+  const postUpsert = yield call(promiseWorker, actionPostUpsert(state,state?._id))
+  console.log('post Upsert', postUpsert)
+
+//   postUpsert
+//   const upsertPost = yield call(promiseWorker, actionPostUpsert(post))
+// console.log('upsert POST', upsertPost)
+ 
+  if (postUpsert) {
+    yield put(actionClearPromiseForName('postUpsert'))
+    yield put(actionClearPromiseForName('uploadFiles'))
+    yield put(actionClearPromiseForName('onePost'))
+  }
+  
+}
+export function* editPostWatcher() {
+  yield takeEvery("CREATE_EDIT_POST", editPostWorker)
+  
+}
+export const actionCreateEditPost= (state) =>
+({
+    type:"CREATE_EDIT_POST", state
+})
 // export const actionDeleteFullLikeFeed = (likeId, postId) => async (
 //     dispatch,
 //     getState,