@holochain-open-dev/calendar-events

v0.0.2

Published

2 years ago

Holochain reusable module to include calendar events in your happ

Downloads

0High
0Medium
0Low

matthme

zippy314

guillem.cordoba

CalendarEventsModule

Small module to create and see calendar events, in holochain RSM.

This module is designed to be included in other DNAs, assuming as little as possible from those. It is packaged as a holochain zome, and an npm package that offers native Web Components that can be used across browsers and frameworks.

Please note, this module is in its early infancy, right now more usable as a reference for building reusable modules. Help is appreciated and much needed!

Documentation

See our storybook.

Assumptions

These are the things you need to know to decide if you can use this module in your happ:

Zome:
- Optional dependency with the resource-bookings-zome.
UI module:
- ApolloClient as the state-management and data-fetching engine.
- The resolvers are declared in the frontend using makeExecutableSchema.
- No framework or library assumed.

Installation and usage

Including the zome in your DNA

You need to include this repository as a git submodule inside the zomes/ folder of your application.

From the root folder of your DNA:

git submodule add https://github.com/holochain-open-dev/calendar-events-module zomes/calendar_events.
Modify the Cargo.toml and add zomes/calendar_events in the [members] array.
Add the calendar_events zome in the dna.json of your <DNA_NAME>.dna.workdir.
Compile the DNA with the usual CARGO_TARGET=target cargo build --release --target wasm32-unknown-unknown .

Now the submodule is added and linked with the code from this repository. In the future, whenever this repository is cloned, run git submodule init and git submodule update.

You can read more documentation on git submodules here.

Using the UI module

Install the module with npm install @holochain-open-dev/calendar-events.
Add the GraphQl schema and resolvers to your ApolloClient setup:

import { AppWebsocket } from "@holochain/conductor-api";
import {
  calendarEventsTypeDefs,
  calendarEventsResolvers,
} from "@holochain-open-dev/calendar-events";

export async function setupClient(url) {
  const appWebsocket = await AppWebsocket.connect(String(url));

  const appInfo = await appWebsocket.appInfo({ app_id: "test-app" });

  const cellId = appInfo.cell_data[0][0];

  const executableSchema = makeExecutableSchema({
    typeDefs: [rootTypeDef, calendarEventsTypeDefs],
    resolvers: [calendarEventsResolvers(appWebsocket, cellId)],
  });

  const schemaLink = new SchemaLink({ schema: executableSchema });

  return new ApolloClient({
    typeDefs: allTypeDefs,
    cache: new InMemoryCache(),
    link: schemaLink,
  });
}

In the root file of your application, install the module:

import { CalendarEventsModule } from "@holochain-open-dev/calendar-events";
async function initApp() {
  const client = await setupClient(`ws://localhost:8888`);

  const calendarEventsModule = new CalendarEventsModule(client);

  await calendarEventsModule.install();
}

Once you have installed the module, all the elements you see in our storybook will become available for you to use in your HTML, like this:

...
<body>
  <hod-my-calendar></hod-my-calendar>
</body>

Take into account that at this point the elements already expect a holochain conductor running at ws://localhost:8888.

Developer setup

This respository is structured in the following way:

Top level src/ and Cargo.toml contains the code for the zome itself. This is to allow direct usage of the zome through git submodule.
ui/: UI library.
example-dna/: an example of a DNA that uses the zome. It contains a link to the zome code and its tryorama tests.

Read the UI developer setup and the Zome developer setup.

Published

Vulnerabilities

Links

Maintainers

Keywords

Readme