MobX-GitHub

MobX SDK for GitHub RESTful API, which is based on MobX-RESTful.

Model

1. User
2. Organization
3. Repository
   1. Contributor
   2. Language
   3. Issue

Usage

Installation

npm i mobx-github

Some Node.js tips about the upstream mobx-restful you should know: https://github.com/idea2app/MobX-RESTful?tab=readme-ov-file#usage

tsconfig.json

{
    "compilerOptions": {
        "target": "ES6",
        "moduleResolution": "Node",
        "useDefineForClassFields": true,
        "experimentalDecorators": false,
        "jsx": "react-jsx"
    }
}

model/GitHub.ts

import { githubClient, UserModel } from 'mobx-github';

// Any possible way to pass GitHub access token
// from local files or back-end servers to Web pages
const token = new URLSearchParams(location.search).get('token');

githubClient.use(({ request }, next) => {
    if (token)
        request.headers = {
            authorization: `Bearer ${token}`,
            ...request.headers
        };
    return next();
});

export const userStore = new UserModel();

page/GitHub.tsx

Use WebCell as an Example

import { component, observer } from 'web-cell';

import { userStore, organizationStore, repositoryStore } from '../model/GitHub';

@component({ tagName: 'github-page' })
@observer
export class GitHubPage extends HTMLElement {
    connectedCallback() {
        userStore.getSession();
    }

    disconnectedCallback() {
        userStore.clear();
    }

    render() {
        const { namespaces } = userStore;

        return (
            <select>
                {namespaces.map(({ login }) => (
                    <option key={login}>{login}</option>
                ))}
            </select>
        );
    }
}