How to use the @aws-amplify/api.graphqlOperation function in @aws-amplify/api

deletePost = async (post) => {
    const postId = await post['id'] 
    try {
      await API.graphql(graphqlOperation(deletePost, { id: postId }))
      await this.componentDidMount()
      // console.log('Post successfully deleted.')
    } catch (err) {
      console.log('Error deleting post.', err)
    }
  }

deleteLike = async (likeUserObject) => {
    const likeId = await likeUserObject[0]['id']
    try {
      await API.graphql(graphqlOperation(deleteLike, { id: likeId }))
      await this.componentDidMount()
    } catch (err) {
      console.log('Error deleting like.', err)
    }
  }

async function fetchNotes() {
    try {
      const notesData = await API.graphql(graphqlOperation(listNotes))
      dispatch({ type: 'SET_NOTES', notes: notesData.data.listNotes.items })
    } catch (err) {
      console.log('error: ', err)
      dispatch({ type: 'ERROR' })
    }
  }

createFlagPicture = async (uri) => {
    const key = await uri.substring(uri.indexOf('2F') + 2)
    const pictureObject = await this.state.pictures.filter(photo => photo.file.key === key)
    const pictureId = await pictureObject[0].id
    const flag = {
      id: pictureId,
      flagOwnerId: this.state.flagOwnerId,
      flagOwnerUsername: this.state.flagOwnerUsername,
    }
    try {
      await API.graphql(graphqlOperation(CreateFlagPicture, flag))
      await this.componentDidMount()
    } catch (err) {
      console.log('Error creating like.', err)
    }
  }

async function createNote() {
    const { form } = state
    if (!form.name || !form.description) return alert('please enter a name and description')
    const note = { ...form, clientId: CLIENT_ID, completed: false }
    dispatch({ type: 'ADD_NOTE', note })
    dispatch({ type: 'RESET_FORM' })
    try {
      await API.graphql(graphqlOperation(CreateNote, { input: note }))
      console.log('successfully created note!')
    } catch (err) {
      console.log("error: ", err)
    }
  }