#How to get document id from createDocument and use to updateDocument

85 messages · Page 1 of 1 (latest)

void vigil
#

Can you share the code please?

#

You can inline this line

    const documentId = ID.unique();

To such

    return database.createDocument(
      '6426fd4b827fedc4a23',
      '6426fd9b65c0b7f2c56',
      ID.unique(),
      userData,
    );

As it's just returns string

sturdy palm
#

how to get document id from creatUserDocument

void vigil
#

Next change the function code to await so the document will return and the promise as such

const creatUserDocument = async userData => {
    try {
        return await database.createDocument(
            '6426fd4b827fedc4a23',
            '6426fd9b65c0b7f2c56',
            ID.unique(),
            userData,
        );

    } catch (e) {
        console.error(e.message);
    }

    return null;
};
sturdy palm
void vigil
#

Now every time you'll call the creatUserDocument you'll have the document id
For example

const newDoc = await creatUserDocument({});

if (newDoc !== null) {
    updateUserDocument(newDoc.$id, {color: 'red', side: 2});
}
sturdy palm
#

in create or update

void vigil
#

Not in both of them
This is when you want to use those functions

sturdy palm
#

'creatUserDocument' was used before it was defined

#

'updateUserDocument' was used before it was defined

void vigil
sturdy palm
void vigil
#

Both of them

sturdy palm
void vigil
#

Add it in your React code in the way it should be

sturdy palm
void vigil
#

👍

sturdy palm
#

once check this

void vigil
#

This code just contains the example.
You need to add id whenever you're planning to use it

sturdy palm
void vigil
#

In a few minutes. Yes

sturdy palm
void vigil
#

A. This is your code with the await in the functions return

import {Account, AppwriteException, Client, Databases, ID} from "appwrite"

const client = new Client()
client.setEndpoint('https://api.printfc.in/v1') // Your API Endpoint
    .setProject('64242c801cdd58d2621');
const storage     = Client.storage;
const database    = new Databases(client);
const getUserData = async () => {
    try {
        const account = new Account(client)
        return account.get()
    } catch (error) {
        const appwriteError = AppwriteException;
        throw new Error(appwriteError.message)
    }
}

const login = async (email, password) => {
    try {
        const account = new Account(client)
        return account.createEmailSession(email, password)
    } catch (error) {
        const appwriteError = AppwriteException;
        throw new Error(appwriteError.message)
    }
}


const register = async (email, password) => {
    try {
        const account = new Account(client)
        return account.create(ID.unique(), email, password)
    } catch (error) {
        const appwriteError = AppwriteException;
        throw new Error(appwriteError.message)
    }
}

const creatUserDocument = async userData => {
    try {
        return await database.createDocument(
            '6426fd4b827fedc4a23',
            '6426fd9b65c0b7f2c56',
            ID.unique(),
            userData,
        );

    } catch (e) {
        console.error(e.message);
    }

    return null;
};

const updateUserDocument = async (documentId, {color, side}) => {
    try {
        return await database.updateDocument(
            '6426fd4b827fedc4a23',
            '6426fd9b65c0b7f2c56',
            documentId,
            {color, side},
        );
    } catch (e) {
        console.error(e.message);
    }
    return null;
};


export {

    getUserData,
    Client,
    storage,
    register,
    login,
    creatUserDocument,
    updateUserDocument
};
#

B. Anywhere else - not in that file - you can use those functions like that
This is just an example you need to adapt it to your needs and code

const newDoc = await creatUserDocument({});

if (newDoc !== null) {
    updateUserDocument(newDoc.$id, {color: 'red', side: 2});
}
sturdy palm
void vigil
sturdy palm
#

My issue is I want to add documentid

void vigil
sturdy palm
void vigil
#

Where in your code you call the creatUserDocument function and the updateUserDocument one?

sturdy palm
#

I will use them in different components

void vigil
#

Then let's separate it to two things

  1. The Appwrite part in which you can use as I showed you.

  2. The React part in which you want to able to share the document id between components. For that you will need to refer to React guide about that
    https://react.dev/learn/passing-data-deeply-with-context

Is that right?

sturdy palm
#

this is my appwrite part

#

this is my signup component in which username and email will be stored in database .Here iam using createDocument

#

this is my select component in which user give input through radio buttons .Here i will use updateDocument to store it in appwrite user previous documentid.

#

now i need to get documentid from signup component to select component to update my document

#

this is my problem

void vigil
#

I see, The second thing is indeed something related to react

I didn't developed with React in a long time. I won't be able to help with that topic in the code level.
What I do know is that you need to create a global state and update and set the document ID within it

sturdy palm
#

Everything is working fine when I manually enter the documentid

#

It was storing properly without any errors

void vigil
#

Yes, of course.

The Appwrite part is okay, the only thing you need to add is the ability to save and retrieve the ID from the React side.

sturdy palm
#

😔😔

#

That's my problem from past 2 weeks

void vigil
#

Then it will be best to check with React developers, or consult the React documentations.

wet cloak
#

Can you verify my question:

  1. createDocument will be execute when user register?
  2. Then when/where the updateUserDocument be executed?
sturdy palm
#

1.yes
2. updateUserDocument is executed in different component

wet cloak
#

So it means that you have a user page that contains all the user info and you have this button to update the user document, am I correct?

sturdy palm
#

No

#
  1. I have signup page in which username and email will be stored. Here I have used createDocument
#
  1. In another component (Select.js) in this component user input through radio buttons . Here I will updateDocumnet but I need documentid to do that as this is another component I need documentid
wet cloak
#

If you use next.js then I think the best way is to put the documentId in the url parameters or query string. Otherwise you can use the react router tanstack. This is the efficient way to store the documentId

sturdy palm
#

Can you please help me how to do that

wet cloak
#

Oh I see I understand now

sturdy palm
#

Help me how to do that in react router

wet cloak
#

actually you can use the function feature of appwrite.

  1. You have to create a function named 'Create User Profile' or it depends on your preference. And set this function to listen to the event from Appwrite Authentication.
  2. Now, since the create account method will always return an User Object, which this object contains $id attribute, then instead of using ID.unique in createUserDocument, you can use the $id from User Object
  3. Therefore in your react, you can use the account.get method since this method also return a User Object which contain $id as well.
sturdy palm
#

Iam unable to get you

wet cloak
#

I will do my best to provide you a code, but this takes me a while

sturdy palm
#

Ok I will wait for you

#

Iam struggling with this issue from past 2 weeks

#

This is my appwrite component

#

This is my signup component in which username and email will be stored

#

This is my select.js another component in which I want to store user input through radio button . Here iam using updatedocument

wet cloak
#

This is the simulation example of create account. and every there is new user in your backend, our function will be triggered

#

And if you are not familiar with appwrite function, there is a resources on internet on how to use the appwrite function, and if you are ready to go like you are already familiar with appwrite function, just mention me there and I will help you

sturdy palm
#

Iam new to appwrite I don't know about it

#

Did you understand my issue

#
  1. I have signup page in which username and email will be stored. Here I have used createDocument
#
  1. In another component (Select.js) in this component user input through radio buttons . Here I will updateDocumnet but I need documentid to do that as this is another component I need documentid
wet cloak
# sturdy palm Did you understand my issue

yeah, I did understand the issue here. But what I did is that to optimize your code, function will be the first step of our path way to solve your problem.

Because I believe even you store your DocumentID in your browser something like cache in web, the problem here is that what if the user refresh or exit the website? So the DocumentID stored in your cache will be deleted. Therefore I recommend you to use a cloud function to shorten your code. Because we can take advantage the account.get() method. Because if we use this method it will always return an User Object and we can use the $id attribute here, and treat this $id as your DocumentID. Because in our cloud function implementation we have this code

  const userObject = JSON.parse(req.variables["APPWRITE_FUNCTION_EVENT_DATA"]);
  console.log(userObject);
  try {
    const result = await databases.createDocument(
      "64397a645b2d0000f2e0",
      "64397a6ec7fce839a55c",
      userObject.$id,
      {
        name: userObject.name,
        email: userObject.email,
      }
    );
image.png
sturdy palm
#

I have no idea about cloud functions

wet cloak
#

Please take a look the encircle in our image attached. I did not use the ID.unique as our Document ID when creating a user account, Instead I use the $id of our User Object

image.png
sturdy palm
#

Yes I have seen

wet cloak
sturdy palm
#

This is my githib repo

#

In this I want to store user input from different components

wet cloak
# 
const register = async (email, password) => {
  try {
    const account = new Account(client)
    const result = account.create(ID.unique(), email, password)
    console.log(result)
  } catch (error) {
    const appwriteError = AppwriteException;
    throw new Error(appwriteError.message)
  }
}

I just modify your register method , I put a result and console log here, and I temporarily remove the return here. Can you please screenshot the log in devinspector

sturdy palm
#
  1. Username and email (signup.js)
  2. Filename (Uploadcomp.js)
    3.Color,side (Select.js)
  3. Table values (Showprice.js)
#

This user inputs I should store