functions-app.jsx

import { useState, useEffect } from 'react';
import { Appwrite } from 'appwrite';
import './App.css';

const App = () => {
  const [theArray, setTheArray] = useState([]);
  const [response, setResponse] = useState('');

  // Init your Web SDK
  const sdk = new Appwrite();
  sdk
    .setEndpoint('http://localhost/v1') // Your Appwrite Endpoint
    .setProject(projectID) // Your project ID
  ;

  async function createAnonymousSession(){
    try{
      await sdk.account.createAnonymousSession();
    }catch(err){
        console.log(err)
    }
    
  }

  useEffect(()=> {
    createAnonymousSession();
    if(sdk.account.get !== null){
      try {
        sdk.subscribe('collections.623e9fa6d3bc9f4cc088.documents', response => {
          setResponse(`The Appwrite ${response.event} event was called`)  
        });
        
      } catch (error) {
        console.log(error, 'error')
      }
    }

  }, [])
  
  
  
  const listDocuments = async() => {
    try {
      
      let response = await sdk.database.listDocuments(collectionID);
      response.documents.map(document => setTheArray(prevArray => [...prevArray, document.$id]) )
    } catch (error) {
      console.log(error);
    }
  }
  
  
  const createDocument = async () => {
    try{
      await sdk.database.createDocument(collectionID, "unique()", {
        "message": "Hello World!",
      });
     
      
      listDocuments()
      
      
    }catch(error){
      console.log(error)
    }
           
  }



  const deleteDocument = async () => {
    if (theArray.length > 0) {
      try {
        let documentID = theArray[theArray.length - 1]
        await sdk.database.deleteDocument(collectionID, documentID);
        listDocuments();
      } catch (error) {
        console.log(error)
        
      }
      
    } else {
      alert('database is empty')
    }
    
    
  }
      
      
  return (
    <div className="App">
      <button type='button'>Create Document</button>
      <button type='button'>Delete Document</button>
    </div>
  );
}
export default App;