Product
Introducing SSO
Streamline your login process and enhance security by enabling Single Sign-On (SSO) on the Socket platform, now available for all customers on the Enterprise plan, supporting 20+ identity providers.
@arve.knudsen/choo-routehandler
Advanced tools
Readme
This is a small route handling framework on top of Choo. Beware it's a work in progress and likely to change!!
The core feature of this framework is that it provides a function for wrapping your route handlers,
mitigating the need for writing boilerplate code. It requires three arguments: view
, loader
and layout
. You can also pass an options object as the fourth argument.
render
fulfilling the aforementioned responsibility, optionally
a function loadData
for loading data pertaining to the route before rendering it and
optionally a function or attribute pageTitle
for defining a route's page title.
The loadData function should return a promise resolving to an object to patch Choo state with.state
, prev
and send
, and return a DOM element.state
as its argument, returning whether
the user is logged in or not.The route handler wrapper renders the view for your route inside a container element,
#route-container
, possessing an attribute called data-route
, which encodes the current route
and query string. It also registers a callback via a
MutationObserver that triggers
when said attribute changes, in order to react as the rendered route changes. The reaction is
implemented as a Choo effect handleRouteLoadedIntoDom
, which gets defined in the model part
of the framework.
The behaviour of the route handler is to, once it detects that the currently rendered route changes (including its query string), go through a standard procedure in order to render the corresponding view, depending on whether or not there is a data loading hook for the route:
loadData
hook and render the loading view.loadData
promise resolves, merge the resulting state subgraph into the Choo state
graph. Then call the render
hook in order to render the view corresponding to the route.Just render the view corresponding to the route.
The model, defined in the model.js file of the package (import as e.g.
require('@arve.knudsen/choo-routehandler/model')
), defines state/effects/reducers required
by the framework.
const routeHandler = require('@arve.knudsen/choo-routehandler')
const routeHandlerModel = require('@arve.knudsen/choo-routehandler/model')
const app = require('choo')
const loading = require('./loading')
const layout = require('./layout')
app.model({
state: {...}
})
routeHandlerModel(app)
app.router({default: '/404',}, [
['/404', routeHandler(notFoundView, loading, layout),],
['/', routeHandler(mainView, loading, layout),],
])
FAQs
Simple Choo routing framework, WIP!
The npm package @arve.knudsen/choo-routehandler receives a total of 11 weekly downloads. As such, @arve.knudsen/choo-routehandler popularity was classified as not popular.
We found that @arve.knudsen/choo-routehandler demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 1 open source maintainer 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.
Product
Streamline your login process and enhance security by enabling Single Sign-On (SSO) on the Socket platform, now available for all customers on the Enterprise plan, supporting 20+ identity providers.
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.