Security News
tea.xyz Spam Plagues npm and RubyGems Package Registries
Tea.xyz, a crypto project aimed at rewarding open source contributions, is once again facing backlash due to an influx of spam packages flooding public package registries.
@hydevs/hypb
Advanced tools
Readme
PocketBaseReact hooks and utils for the user-friendly database and API solution :
npm i @hydevs/hypb
Hypb was made and is maintained by Louis Réville 🇫🇷 and and Guillaume Maugin 🇫🇷 to simplify starting and developping webapps.
Contributions, issues and feature requests are welcome!
Feel free to check issues page.
npm i @hydevs/hypb
You can either use your PocketBase url :
import { Hypb } from "@hydevs/hypb";
Hypb.initPB("https://urlToYourPb.io/", {
autoCancelation: false /* default: true */,
userCollection: "users" /* default: "_pb_users_auth_" */,
});
Or use an existing PocketBase instance
import { Hypb } from "@hydevs/hypb";
import Pocketbase from "pocketbase";
const pb = new Pocketbase("https://urlToYourPb.io/");
pb.autoCancelation(false);
Hypb.initPB("https://urlToYourPb.io/", {
autoCancelation: true,
userCollection: "users",
});
Once you've initialized Hypb, you can access the pocketbase object through the Hypb.getPB()
method and use it as in the pocketbase documentation
import { Hypb } from "@hydevs/hypb";
function Component() {
const pb = Hypb.pb;
return <div></div>;
}
Referencing your PB instance in Hypb
is the first prerequisite to let you use our hooks and utils in your application, by making your pb instance accessible to the entire package.
useCollection is used to request every entries from a collection, and store the result as a state. Allows also for real time subscriptions.
It supports : loading and invalidates as well as pagination
import { useCollection } from "@hydevs/hypb";
// defining all options
const defaultValue = []; // Default value for your collection
const queryParams = {
// Specify the params for the request
filter: "...",
sort: "...",
};
const pageParams = {
// Chooses page parameters | Defaults are : page 1 and 50 items per pages
perPages: 10,
page: 1,
};
const useCollectionOptions = {
queryParams,
pageParams,
realtime: true, // Allows for realtime subscription
};
const Component = () => {
const {
records: notes,
invalidate, // manualReload
loading, // true while there's no responses from the db, false otherwise
params, // actual params
pageInfos, // page, perPage, totalItems
setPage, // method to change page, setPage(pageInfos.page + 1)
} = useCollection < note > ("notes", defaultValue, useCollectionOptions);
return (
<>
{loading
? "loading..."
: notes.map((note) => <div key={node.id}> {note.text} </div>)}
</>
);
};
import { AuthProvider } from "@hydevs/hypb";
import { RecordModel } from "pocketbase";
function App() {
return (
<AuthProvider>
<YourApp />
</AuthProvider>
);
}
You can now, anywhere in your app, login, logout, and access to the userData
import { useUserData, loginPB, logoutPB } from "@hydevs/hypb";
const Component = () => {
const { userData, loading, invalidate: manualReload } = useUserData();
return (
<>
<button onClick={() => loginPB("username", "password")}>
Login with PocketBase
</button>
<button onClick={logout}> Logout </button>
{userData && <p>userData</p>}
</>
);
};
AuthProvider
contains additionnal props that you can find in his AuthProviderProps
:
type AuthProviderProps = {
children: React.ReactNode;
initialEmptyUser: RecordModel /* default: {} as RecordModel */;
expand?: string;
};
FAQs
Unknown package
The npm package @hydevs/hypb receives a total of 422 weekly downloads. As such, @hydevs/hypb popularity was classified as not popular.
We found that @hydevs/hypb demonstrated a healthy version release cadence and project activity because the last version was released less than a year ago. It has 2 open source maintainers collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
Tea.xyz, a crypto project aimed at rewarding open source contributions, is once again facing backlash due to an influx of spam packages flooding public package registries.
Security News
As cyber threats become more autonomous, AI-powered defenses are crucial for businesses to stay ahead of attackers who can exploit software vulnerabilities at scale.
Security News
UnitedHealth Group disclosed that the ransomware attack on Change Healthcare compromised protected health information for millions in the U.S., with estimated costs to the company expected to reach $1 billion.