Function useAsset

Custom React hook for managing and performing CRUD operations on assets.

This hook handles the state management for an asset and its associated file, including fetching, updating, and deleting the asset as well as pushing changes to the asset or its file. It returns a set of methods and state related to the asset.

Example

import { useAsset } from 'react-playmakers';

const AssetManager = () => {
  const { asset, fetched, setAsset, push, delete: deleteAsset, refresh } = useAsset('aXXXXXXXX');
  const [newName, setNewName] = useState('');

  const handleUpdateAsset = async () => {
    try {
      await push({ name: newName });
      alert('Asset updated successfully!');
    } catch (error) {
      console.error('Failed to update asset', error);
    }
  };

  const handleDeleteAsset = async () => {
    try {
      await deleteAsset();
      alert('Asset deleted successfully!');
    } catch (error) {
      console.error('Failed to delete asset', error);
    }
  };

  if (!fetched) {
    return <div>Loading asset...</div>;
  }

  return (
    <div>
      <h1>Asset Manager</h1>
      {asset ? (
        <>
          <p>Asset Name: {asset.name}</p>
          <input
            type="text"
            value={newName}
            onChange={(e) => setNewName(e.target.value)}
            placeholder="Enter new name"
          />
          <button onClick={handleUpdateAsset}>Update Asset</button>
          <button onClick={handleDeleteAsset}>Delete Asset</button>
          <button onClick={refresh}>Refresh Asset</button>
        </>
      ) : (
        <p>No asset found.</p>
      )}
    </div>
  );
};

export default AssetManager;
Copy