A lightweight React.js wrapper for the Frappe REST API, enabling easy integration with Frappe backend in your React applications.
- Easy login with username/password or API key/secret
- Hooks for standard REST operations (GET, POST, PUT, DELETE)
- File upload/download support (coming soon)
npm install @rustedcompiler/frappe-hooksWrap your application with the FrappeProvider to initialize the client globally:
import { FrappeProvider } from '@rustedcompiler/frappe-hooks';
function App({ children }) {
return (
<FrappeProvider
options={{
baseURL: 'https://asa.aksla.com',
// Optional if using token authentication
token: 'api_key:api_secret',
}}
>
<body>{children}</body>
</FrappeProvider>
);
}import {useDocuments , useDocument } from "@rustedcompiler/frappe-hooks"
// Get all documents of a specific DocType
import { useDocuments } from '@rustedcompiler/frappe-hooks';
const { data } = useDocuments({
docType: docType,
enabled: true,
});// query
const { data } = useDocuments({
docType: docType,
query: {
},
enabled: true,
filters: [
{
query: 'email',
operand: 'EQ',
value: '[email protected]',
}
],
});By default all filters will be using AND, In Order to use OR
const { data } = useDocuments({
docType: docType,
query: {
},
enabled: true,
filters: [
{
query: 'email',
operand: 'EQ',
value: '[email protected]',
},
{
query: 'email',
operand: 'EQ',
value: '[email protected]',
}
],
isOR:true
});// Get a single document
import { useDocument } from '@rustedcompiler/frappe-hooks';
const { data } = useDocument(docType, documentId); // Update a document
const { updateDocument } = useDocument();
await updateDocument(docType, documentId, {
score: 0,
});// Delete a document
const { deleteDocument } = useDocument();
await deleteDocument(docType, documentId);import { useEffect } from 'react';
import { useAuth } from '@rustedcompiler/frappe-hooks';
function MyComponent() {
const { loginWithPassword, currentUser , logout } = useAuth();
useEffect(() => {
console.log(currentUser);
}, [currentUser]);
}