# rice-instructor

> ## LoginForm and getClient

Latest version **0.0.23** (published 2021-03-01) · MIT license · 0 weekly downloads

## Install

```sh
npm install rice-instructor
pnpm add rice-instructor
yarn add rice-instructor
bun add rice-instructor
```

## Health

**Score 25/100 (F)** — status: abandoned.

Positive: has types; no vulnerabilities; high quality score.

Warnings: low downloads; no esm support; pre 1.0.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 0.0.23 |
| Published | 2021-03-01 |
| First published | 2018-07-21 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | bundled |
| Module format | CommonJS |
| Node | >=6.0.0 |
| Dependencies | 3 |
| Unpacked size | 75.4 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Author | Conan Li |
| Maintainers | vanillarice |

## Links

- npm: https://www.npmjs.com/package/rice-instructor
- npm.io page: https://npm.io/package/rice-instructor

## Dependencies (3)

- [jwt-decode](https://npm.io/package/jwt-decode.md) ^3.1.2
- [react-router-dom](https://npm.io/package/react-router-dom.md) ^5.2.0
- [@types/react-router-dom](https://npm.io/package/@types/react-router-dom.md) ^5.1.7

## Recent versions

- 0.0.23 (latest) — 2021-03-01
- 0.0.22 — 2021-03-01
- 0.0.21 — 2021-03-01
- 0.0.20 — 2021-02-28
- 0.0.19 — 2021-02-28
- 0.0.18 — 2021-02-28
- 0.0.17 — 2021-02-28
- 0.0.16 — 2021-02-28
- 0.0.15 — 2021-02-27
- 0.0.14 — 2019-04-20
- 0.0.13 — 2018-11-02
- 0.0.12 — 2018-11-02
- 0.0.11 — 2018-10-30
- 0.0.10 — 2018-10-30
- 0.0.9 — 2018-10-30
- … 18 more at https://npm.io/package/rice-instructor/versions

## README

# Usage

## LoginForm and getClient

```ts
import * as React from 'react'
import { ApolloProvider } from '@apollo/client'

import { BrowserRouter, Switch, Route } from 'react-router-dom'
import { Home } from './Home'
import { LoginForm, getClient } from 'rice-instructor'

const submitCredential = async (username: string, password: string) => {
  const res = await fetch(`http://localhost:8888/login`, {
    method: 'POST',
    body: JSON.stringify({ username, password }),
    headers: {
      'Content-Type': 'application/json',
      'X-Requested-With': 'XMLHttpRequest',
    },
  })

  const data = await res.json()
  if (data.code === 200) {
    sessionStorage.setItem('authToken', data.token)
    // Redirect to root
    window.location.href = '/'
  } else {
    throw data
  }
  return data
}

const Routes = () => {
  return (
    <BrowserRouter>
      <div>
        <Switch>
          <Route exact path="/LoginPage">
            <LoginForm onSubmitCredential={submitCredential} />
          </Route>
          <Route path="/" component={Home}></Route>
        </Switch>
      </div>
    </BrowserRouter>
  )
}
const client = getClient({ uri: 'http://localhost:8888/graphql' })
const App = () => {
  return (
    <ApolloProvider client={client}>
      <Routes />
    </ApolloProvider>
  )
}
```

## Directory, SnackProvider and Admin

```ts
import * as React from 'react'
import { ThemeProvider } from '@material-ui/core/styles'

import { SnackProvider, Admin, Directory } from 'rice-instructor'

import { theme } from '../theme'

const routes = [{ path: '/Admin', children: <Admin /> }]
export const Home = () => {
  return (
    <ThemeProvider theme={theme}>
      <SnackProvider>
        <Directory routes={routes} redirectToLoginIfUnauthenticated={true} />
      </SnackProvider>
    </ThemeProvider>
  )
}
```

# Install locally

- `yarn install && yarn build && yarn link`
- In another repo: `yarn link "rice-instructor"`

---
_Source: https://npm.io/package/rice-instructor · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._