[react-moralis] object helper methods using react-moralis?

[bonobo]

Currently I have a utils file which I used to abstract away object related code for example,

// object
const Item = moralis.Object.extend("Item", {
  getTitle: function() {
    return this.get("title").toString();
  },
  getPrice: function() {
    return this.get("price").toString();
  }
}
// helper function
const createNewItem = async (
  title,
  price,
) => {
  const newItem = new Item();

  newItem.set("title", title.toString());
  newItem.set("price", parseFloat(price));


  const item = await newItem.save();

  return item;
};

const editItem = async (title, price) => {
  const itemQuery = new moralis.Query(Item);
  const existingItem = await itemQuery.get(blanked);
};

// snip

but i notice with react-moralis which uses hooks, I can’t abstract away reusable code like this into some other file since I can only use hooks with components.

Does the team have any advise to abstract code like this or does the team intend for the same code to be written for every component that uses it or does the team intend for a mixed usage or react-moralis and vanilla moralis.

Thank you and have a nice day.

[Erno]

react-moralis is a library with helper functions and tools to implement main features easily. You are not limited to it though. You can still use Moralis in any way, on top of it, to make your own hooks, functions etc.

You can import Moralis via import {Moralis} from 'moralis', or via a hook const {Moralis} = useMoralis(). In the end it is all Javascript, so you can use any vanilla moralis logic that you want.

If you want to re-use logic in hooks, you could also look at making custom hooks.

[Xyz]

Hey man @Erno,

How do I log out of a wallet using Moralis?

This allowed me to log in:

                    <button className="button-connect" 
                        onClick={() => enableWeb3({provider: 'Current Provider'})} 
                        disabled={isWeb3EnableLoading}>
                        Connect Wallet
                    </button>

Thank you very much

[Yomoo]

Hey @Xyz

I’m not Erno, but can anser your question too

const LogoutButton = () => {
  const { logout, isAuthenticating } = useMoralis();

  <button onClick={() => logout()} disabled={isAuthenticating}>
    Authenticate
  </button>;
};

Take a look at React Moralis Docs. There you can find a lot of useful information.

[Xyz]

Hey man, thanks for the reply!

I used this code but my metamask was not logged out, and is still connected to the page:

const { logout, isAuthenticating } = useMoralis();

<div className="modal-swap" onClick={() => logout()} disabled={isAuthenticating}>
   <FaTimes />
</div>

Here’s a photo:

MetaMask not disconnected

[Yomoo]

Hey @Xyz

Connected status in the MetaMask means that the app have permissions to “use” your wallet. You allow the apps to use your wallet at the first time. Log out functionality works well.

[Xyz]

Hi man, thanks for the response, Have a great day!

[Yomoo]

You are welcome!

[doublehelixX]

How would you carry the log in state from across the webpages ? I see that it stores some information upon authenticating within the browser local storage but how can I still use that so that moralis blockchain transactions can still be processed?