paperbits / paperbits-demo

This repository shows an example how developers can use Paperbits to build web apps with rich content authoring capabilities.
https://demo.paperbits.io
MIT License
300 stars 90 forks source link

Running paperbits-demo using Github as blob and object storage #191

Open feranto opened 3 years ago

feranto commented 3 years ago

Describe the bug I'm trying to implement the githubmodule for object and blob storage for the demo website with no success.

To Reproduce

  1. Installed and added the github module to package.json

Package.json

...
        "@paperbits/github": "^0.1.438",
...
  1. Created a personal access token on github with full access to "repo" scope
  2. Added the credentials to the following files:

config.publish.json:

...
    "github": {
        "authorizationKey": "<personalAcessToken>",
        "repositoryName": "<myREPO>",
        "repositoryOwner": "<myUsername>",
        "pathToData": "project/src/data/demo.json"
    }
...

config.design.json:

...
    "github": {
        "authorizationKey": "<personalAcessToken>",
        "repositoryName": "<myREPO>",
        "repositoryOwner": "<myUsername>",
        "pathToData": "project/src/data/demo.json"
    }
...
  1. Inject module in the following files:

startup.design.ts

import "./polyfills";
import * as ko from "knockout";
import { InversifyInjector } from "@paperbits/common/injection";
import { CoreDesignModule } from "@paperbits/core/core.design.module";
import { FormsDesignModule } from "@paperbits/forms/forms.design.module";
import { EmailsDesignModule } from "@paperbits/emails/emails.design.module";
import { StylesDesignModule } from "@paperbits/styles/styles.design.module";
import { ProseMirrorModule } from "@paperbits/prosemirror/prosemirror.module";
import { OfflineModule } from "@paperbits/common/persistence/offline.module";
import { DemoDesignModule } from "./modules/demo.design.module";

/* Github storage module */
import { GithubDesignModule } from "@paperbits/github/github.design.module"

/* Initializing dependency injection  */
const injector = new InversifyInjector();
injector.bindModule(new CoreDesignModule());
injector.bindModule(new FormsDesignModule());
injector.bindModule(new EmailsDesignModule());
injector.bindModule(new StylesDesignModule());
injector.bindModule(new ProseMirrorModule());
injector.bindModule(new DemoDesignModule());

/* Injection Github Module */
injector.bindModule(new GithubDesignModule());

injector.bindModule(new OfflineModule({ autosave: false }));
injector.resolve("autostart");

document.addEventListener("DOMContentLoaded", () => {
    setImmediate(() => ko.applyBindings(undefined, document.body));
});

startup.publish.ts

import { InversifyInjector } from "@paperbits/common/injection";
 import { IPublisher } from "@paperbits/common/publishing";
 import { CacheStorageModule } from "@paperbits/common/publishing/cacheStorageModule";
 import { FormsModule } from "@paperbits/forms/forms.module";
 import { CoreModule } from "@paperbits/core/core.module";
 import { CorePublishModule } from "@paperbits/core/core.publish.module";
 import { EmailsModule } from "@paperbits/emails/emails.module";
 import { EmailsPublishModule } from "@paperbits/emails/emails.publish.module";
 import { StylePublishModule } from "@paperbits/styles/styles.publish.module";
 import { ProseMirrorModule } from "@paperbits/prosemirror/prosemirror.module";
 import { IntercomPublishModule } from "@paperbits/intercom/intercom.publish.module";
 import { GoogleTagManagerPublishModule } from "@paperbits/gtm/gtm.publish.module";
 import { DemoPublishModule } from "./modules/demo.publish.module";

  /* Github storage module */
 import { GithubPublishModule } from "@paperbits/github/github.publish.module";

 /* Initializing dependency injection  */
 const injector = new InversifyInjector();
 injector.bindModule(new CoreModule());
 injector.bindModule(new CorePublishModule());
 injector.bindModule(new FormsModule());
 injector.bindModule(new EmailsModule());
 injector.bindModule(new EmailsPublishModule());
 injector.bindModule(new StylePublishModule());
 injector.bindModule(new ProseMirrorModule());
 injector.bindModule(new IntercomPublishModule());
 injector.bindModule(new GoogleTagManagerPublishModule());

 /* Initializing Demo module */
 const outputBasePath = "./dist/website";
 const settingsPath = "./dist/publisher/config.json";
 const dataPath = "./dist/publisher/data/demo.json";
 injector.bindModule(new DemoPublishModule(dataPath, settingsPath, outputBasePath));

 /* Injection Github Module */
 injector.bindModule(new GithubPublishModule());

 injector.bindModule(new CacheStorageModule());
 injector.resolve("autostart");

 const publisher = injector.resolve<IPublisher>("sitePublisher");

 /* Running actual publishing */
 publisher.publish()
     .then(() => {
         console.log("DONE.");
         process.exit();
     })
     .catch((error) => {
         console.log(error);
         process.exit();
     });

And I'm getting the following error when running npm start:

    ERROR in /workspaces/paperbits-demo/project/node_modules/@paperbits/github/githubObjectStorage.ts
    [tsl] ERROR in /workspaces/paperbits-demo/project/node_modules/@paperbits/github/githubObjectStorage.ts(98,18)
          TS2416: Property 'searchObjects' in type 'GithubObjectStorage' is not assignable to the same property in base type 'IObjectStorage'.
      Type '<T>(path: string, query: Query<T>) => Promise<Bag<T>>' is not assignable to type '<T>(key: string, query?: Query<T>) => Promise<Page<T>>'.
        Type 'Promise<Bag<any>>' is not assignable to type 'Promise<Page<any>>'.
          Property 'value' is missing in type 'Bag<any>' but required in type 'Page<any>'.

Expected behavior Being able to run the paperbits-demo website using Github for objectstorage and blobstorage, exactly as you can do with Firebase.

Screenshots If applicable, add screenshots to help explain your problem.

Desktop (please complete the following information):

Additional context We would appreciate to have a full documentation of the Github storage module, at the same level with the Firebase module.

azaslonov commented 3 years ago

Thanks Fernando, we'll check this and fix it.

msrshahrukh100 commented 2 years ago

Hi, @azaslonov I am still facing this issue. Can you please help us with this? Thanks