@qoretechnologies/reqraft 0.1.0 → 0.2.1

package/src/providers/FetchProvider.tsx

@@ -0,0 +1,62 @@
+import { useQueryClient } from '@tanstack/react-query';
+import { useState } from 'react';
+import { useEffectOnce } from 'react-use';
+import { FetchContext, TReqraftContextQueryConfig } from '../contexts/FetchContext';
+import { useReqraftProperty } from '../hooks/useReqraftProperty';
+import { query, setupFetch } from '../utils/fetch';
+
+export interface IReqraftFetchProviderProps {
+  children: React.ReactNode;
+}
+
+export const ReqraftFetchProvider = ({ children }: IReqraftFetchProviderProps) => {
+  const queryClient = useQueryClient();
+  const instance = useReqraftProperty('instance');
+  const instanceToken = useReqraftProperty('instanceToken');
+  const instanceUnauthorizedRedirect = useReqraftProperty('instanceUnauthorizedRedirect');
+
+  const [ready, setReady] = useState(false);
+
+  useEffectOnce(() => {
+    setupFetch({
+      instance,
+      instanceToken,
+      unauthorizedRedirect: instanceUnauthorizedRedirect,
+    });
+
+    setReady(true);
+  });
+
+  if (!ready) {
+    return null;
+  }
+
+  async function get<T>(config: TReqraftContextQueryConfig) {
+    return query<T>({ queryClient, ...config, method: 'GET' });
+  }
+
+  async function post<T>(config: TReqraftContextQueryConfig) {
+    return query<T>({ queryClient, ...config, method: 'POST' });
+  }
+
+  async function put<T>(config: TReqraftContextQueryConfig) {
+    return query<T>({ queryClient, ...config, method: 'PUT' });
+  }
+
+  async function del<T>(config: TReqraftContextQueryConfig) {
+    return query<T>({ queryClient, ...config, method: 'DELETE' });
+  }
+
+  return (
+    <FetchContext.Provider
+      value={{
+        get,
+        post,
+        put,
+        del,
+      }}
+    >
+      {children}
+    </FetchContext.Provider>
+  );
+};

package/src/providers/ReqraftProvider.tsx

@@ -0,0 +1,33 @@
+import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
+import { ReactNode } from 'react';
+import { IReqraftContext, ReqraftContext } from '../contexts/ReqraftContext';
+import { ReqraftFetchProvider } from './FetchProvider';
+import { ReqraftStorageProvider } from './StorageProvider';
+
+export const ReqraftQueryClient = new QueryClient();
+
+export interface IReqraftProviderProps extends IReqraftContext {
+  children: ReactNode;
+  reactQueryClient?: QueryClient;
+}
+
+export const ReqraftProvider = ({
+  appName,
+  children,
+  instance,
+  instanceToken,
+  instanceUnauthorizedRedirect,
+  reactQueryClient,
+}: IReqraftProviderProps) => {
+  return (
+    <ReqraftContext.Provider
+      value={{ appName, instanceToken, instance, instanceUnauthorizedRedirect }}
+    >
+      <QueryClientProvider client={reactQueryClient || ReqraftQueryClient}>
+        <ReqraftFetchProvider>
+          <ReqraftStorageProvider>{children}</ReqraftStorageProvider>
+        </ReqraftFetchProvider>
+      </QueryClientProvider>
+    </ReqraftContext.Provider>
+  );
+};

package/src/providers/StorageProvider.tsx

@@ -0,0 +1,80 @@
+import { cloneDeep, get, set } from 'lodash';
+import { ReactNode, useEffect, useState } from 'react';
+import type { Get } from 'type-fest';
+import { ReqraftStorageContext, TReqraftStorage } from '../contexts/StorageContext';
+import { useFetch } from '../hooks/useFetch/useFetch';
+import { useReqraftProperty } from '../hooks/useReqraftProperty';
+import { TReqraftStorageValue } from '../hooks/useStorage/useStorage';
+
+export interface IReqraftStorageProviderProps {
+  children: ReactNode;
+}
+
+export const ReqraftStorageProvider = ({ children }: IReqraftStorageProviderProps) => {
+  const appName = useReqraftProperty('appName');
+
+  const { data, loading } = useFetch({
+    url: 'users/_current_/storage',
+    cache: false,
+    loadOnMount: true,
+  });
+
+  const { load } = useFetch({
+    url: 'users/_current_/',
+    method: 'PUT',
+    cache: false,
+  });
+
+  const [storage, setStorage] = useState<TReqraftStorage>(data);
+
+  useEffect(() => {
+    if (data) {
+      setStorage(data);
+    }
+  }, [data]);
+
+  const getStorage = function <T extends TReqraftStorageValue>(
+    path: string,
+    defaultValue: T,
+    includeAppPrefix: boolean = true
+  ): Get<TReqraftStorage, string> {
+    const _path = includeAppPrefix ? `${appName}.${path}` : path;
+
+    return get(storage, _path) ?? defaultValue;
+  };
+
+  const updateStorage = function <T extends TReqraftStorageValue>(
+    path: string,
+    value: T,
+    includeAppPrefix: boolean = true
+  ) {
+    const _path = includeAppPrefix ? `${appName}.${path}` : path;
+    const updatedStorage = set(cloneDeep(storage), _path, value);
+
+    setStorage(updatedStorage);
+
+    load({ body: { storage: updatedStorage } });
+  };
+
+  const removeStorageValue = function (path: string, includeAppPrefix: boolean = true) {
+    const _path = includeAppPrefix ? `${appName}.${path}` : path;
+
+    const updatedStorage = set(cloneDeep(storage), _path, null);
+
+    setStorage(updatedStorage);
+
+    load({ body: { storage_path: _path } });
+  };
+
+  if (loading || !storage) {
+    return null;
+  }
+
+  return (
+    <ReqraftStorageContext.Provider
+      value={{ storage, getStorage, updateStorage, removeStorageValue }}
+    >
+      {children}
+    </ReqraftStorageContext.Provider>
+  );
+};

package/src/utils/fetch.ts

@@ -0,0 +1,121 @@
+import { QueryClient } from '@tanstack/react-query';
+import { ReqraftQueryClient } from '../providers/ReqraftProvider';
+
+export interface IReqraftFetchConfig {
+  instance: string;
+  instanceToken: string;
+  unauthorizedRedirect?: (pathname: string) => string;
+}
+
+export interface IReqraftFetchResponse<T> {
+  data: T;
+  ok: boolean;
+  code?: number;
+  error?: any;
+}
+
+const fetchConfig: IReqraftFetchConfig = {
+  instance: window.location.origin + '/',
+  instanceToken: '',
+  unauthorizedRedirect: (pathname: string) => `/?next=${pathname}`,
+};
+
+const CACHE_EXPIRATION_TIME = 5 * 60 * 1000; // 5 minutes
+
+export const setupFetch = ({
+  instance,
+  instanceToken,
+  unauthorizedRedirect,
+}: IReqraftFetchConfig) => {
+  fetchConfig.instance = instance;
+  fetchConfig.instanceToken = instanceToken;
+
+  if (unauthorizedRedirect) {
+    fetchConfig.unauthorizedRedirect = unauthorizedRedirect;
+  }
+};
+
+async function doFetchData(
+  url: string,
+  method = 'GET',
+  body?: { [key: string]: any }
+): Promise<Response> {
+  if (!fetchConfig.instanceToken) {
+    return new Response(JSON.stringify({}), {
+      status: 401,
+      statusText: 'Unauthorized',
+    });
+  }
+
+  return fetch(`${fetchConfig.instance}api/latest/${url}`, {
+    method,
+    headers: {
+      'Content-Type': 'application/json',
+      Authorization: `Bearer ${fetchConfig.instanceToken}`,
+    },
+    body: JSON.stringify(body),
+  }).catch((error) => {
+    return new Response(JSON.stringify({}), {
+      status: 500,
+      statusText: `Request failed ${error.message}`,
+    });
+  });
+}
+
+export interface IReqraftQueryConfig {
+  url: string;
+  method?: 'GET' | 'POST' | 'PUT' | 'DELETE';
+  body?: Record<string | number, any>;
+  cache?: boolean;
+  queryClient?: QueryClient;
+}
+
+export async function query<T>({
+  url,
+  method = 'GET',
+  body,
+  cache = true,
+  queryClient = ReqraftQueryClient,
+}: IReqraftQueryConfig): Promise<IReqraftFetchResponse<T>> {
+  const shouldCache = method === 'DELETE' || method === 'POST' ? false : cache;
+  const cacheKey = `${url}:${method}:${JSON.stringify(body || {})}`;
+
+  const requestData = await queryClient.fetchQuery({
+    queryKey: [cacheKey],
+    queryFn: async () => {
+      const response = await doFetchData(url, method, body);
+
+      const clone = response.clone();
+      const json = await clone.json();
+
+      if (response.status === 401) {
+        window.location.href = fetchConfig.unauthorizedRedirect(window.location.pathname);
+      }
+
+      return {
+        data: json,
+        ok: response.ok,
+        status: response.status,
+        statusText: response.statusText,
+      };
+    },
+    staleTime: shouldCache ? CACHE_EXPIRATION_TIME : 0,
+  });
+
+  if (!requestData.ok) {
+    queryClient.invalidateQueries({ queryKey: [cacheKey] });
+
+    return {
+      data: null,
+      ok: false,
+      code: requestData.status,
+      error: requestData.statusText,
+    };
+  }
+
+  return {
+    data: requestData.data,
+    ok: true,
+    code: requestData.status,
+  };
+}

package/.eslintrc.js

@@ -1,40 +0,0 @@
-module.exports = {
-  env: {
-    browser: true,
-    es2021: true,
-  },
-  extends: [
-    'eslint:recommended',
-    'plugin:@typescript-eslint/recommended',
-    'plugin:react/recommended',
-    'plugin:react/jsx-runtime',
-  ],
-  overrides: [
-    {
-      env: {
-        node: true,
-      },
-      files: ['.eslintrc.{js,cjs}'],
-      parserOptions: {
-        sourceType: 'script',
-      },
-    },
-  ],
-  parser: '@typescript-eslint/parser',
-  parserOptions: {
-    ecmaVersion: 'latest',
-    sourceType: 'module',
-  },
-  plugins: ['@typescript-eslint', 'react'],
-  rules: {
-    'linebreak-style': ['error', 'unix'],
-    semi: ['error', 'always'],
-    '@typescript-eslint/no-explicit-any': 'off',
-    'react/display-name': 'off',
-    'react/prop-types': 'off',
-    'no-extra-boolean-cast': 'off',
-    'no-console': ['error', { allow: ['warn', 'error'] }],
-  },
-  // Ignore storybook files
-  ignorePatterns: ['**/stories/*', '**/mock/*'],
-};

package/.github/ISSUE_TEMPLATE/bug_report.md

@@ -1,38 +0,0 @@
----
-name: Bug report
-about: Create a report to help us improve
-title: "[BUG] "
-labels: bug
-assignees: Foxhoundn
-
----
-
-**Describe the bug**
-A clear and concise description of what the bug is.
-
-**To Reproduce**
-Steps to reproduce the behavior:
-1. Go to '...'
-2. Click on '....'
-3. Scroll down to '....'
-4. See error
-
-**Expected behavior**
-A clear and concise description of what you expected to happen.
-
-**Screenshots**
-If applicable, add screenshots to help explain your problem.
-
-**Desktop (please complete the following information):**
- - OS: [e.g. iOS]
- - Browser [e.g. chrome, safari]
- - Version [e.g. 22]
-
-**Smartphone (please complete the following information):**
- - Device: [e.g. iPhone6]
- - OS: [e.g. iOS8.1]
- - Browser [e.g. stock browser, safari]
- - Version [e.g. 22]
-
-**Additional context**
-Add any other context about the problem here.

package/.github/ISSUE_TEMPLATE/feature_request.md

@@ -1,20 +0,0 @@
----
-name: Feature request
-about: Suggest an idea for this project
-title: "[ENHANCEMENT] "
-labels: enhancement
-assignees: Foxhoundn
-
----
-
-**Is your feature request related to a problem? Please describe.**
-A clear and concise description of what the problem is. Ex. I'm always frustrated when [...]
-
-**Describe the solution you'd like**
-A clear and concise description of what you want to happen.
-
-**Describe alternatives you've considered**
-A clear and concise description of any alternative solutions or features you've considered.
-
-**Additional context**
-Add any other context or screenshots about the feature request here.

package/.github/ISSUE_TEMPLATE/new-component.md

@@ -1,20 +0,0 @@
----
-name: New component
-about: New component suggestion
-title: "[NEW COMPONENT]"
-labels: enhancement
-assignees: Foxhoundn
-
----
-
-**Component name**
-What should the component be named? Use self-describing name
-
-**Component purpose**
-Describe thoroughly the purpose of the suggested / proposed component.
-
-**Component reference**
-Is there another library already using this kind of the component?
-
-**Screenshot / Draft of the component**
-Add visual representation of the component if there is any

package/.github/ISSUE_TEMPLATE/visual-bug-report.md

@@ -1,38 +0,0 @@
----
-name: Visual bug report
-about: Create a report to help us improve
-title: "[VISUAL BUG]"
-labels: bug
-assignees: Foxhoundn
-
----
-
-**Describe the bug**
-A clear and concise description of what the bug is.
-
-**To Reproduce**
-Steps to reproduce the behavior:
-1. Go to '...'
-2. Click on '....'
-3. Scroll down to '....'
-4. See error
-
-**Expected behavior**
-A clear and concise description of what you expected to happen.
-
-**Screenshots**
-If applicable, add screenshots to help explain your problem.
-
-**Desktop (please complete the following information):**
- - OS: [e.g. iOS]
- - Browser [e.g. chrome, safari]
- - Version [e.g. 22]
-
-**Smartphone (please complete the following information):**
- - Device: [e.g. iPhone6]
- - OS: [e.g. iOS8.1]
- - Browser [e.g. stock browser, safari]
- - Version [e.g. 22]
-
-**Additional context**
-Add any other context about the problem here.

package/.github/workflows/beta_release.yml

@@ -1,108 +0,0 @@
-# This is a basic workflow to help you get started with Actions
-
-name: Beta release
-
-# Controls when the action will run. Triggers the workflow on push or pull request
-# events but only for the develop branch
-on:
-  push:
-    branches:
-      - develop
-
-# A workflow run is made up of one or more jobs that can run sequentially or in parallel
-jobs:
-  Publish-and-release:
-    # The type of runner that the job will run on
-    runs-on: ubuntu-latest
-
-    # Steps represent a sequence of tasks that will be executed as part of the job
-    steps:
-      - name: Get current time
-        uses: josStorer/get-current-time@v2.0.2
-        id: current_time
-        with:
-          format: YYYYMMDD-HH
-          utcOffset: '+01:00'
-      # Checks-out your repository under $GITHUB_WORKSPACE, so your job can access it
-      # Checkout the repo
-      - uses: actions/checkout@v3
-        with:
-          fetch-depth: 0
-          ref: ${{ github.event.pull_request.head.sha }}
-
-      # Get commit message
-      - name: Print head git commit message
-        id: get_head_commit_message
-        run: echo "::set-output name=HEAD_COMMIT_MESSAGE::$(git show -s --format=%s)"
-
-      - uses: actions/setup-node@v3
-        with:
-          node-version: 20.11.0
-
-      - name: Save release version to outputs
-        id: save_release_version
-        run: echo ::set-output name=version::$(node -pe "require('./package.json').version")
-
-      - name: Installing modules
-        id: install_modules
-        run: |
-          yarn cache clean
-          rm -rf node_modules
-          yarn install
-
-      - name: Running tests
-        id: tests
-        run: yarn test:ci
-
-      - name: Build
-        id: build
-        run: yarn build
-
-      - name: Publish to NPM
-        id: npm_publish
-        uses: JS-DevTools/npm-publish@v1
-        with:
-          token: ${{ secrets.NPM_TOKEN }}
-          tag: beta
-          access: public
-
-      - name: Publish to Chromatic
-        id: chromatic_publish
-        uses: chromaui/action@v1
-        with:
-          token: ${{ secrets.GITHUB_TOKEN }}
-          projectToken: ${{ secrets.CHROMATIC_PROJECT_TOKEN }}
-
-      - name: Create a release
-        id: release
-        uses: actions/create-release@v1
-        env:
-          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
-        with:
-          tag_name: v${{ steps.save_release_version.outputs.version }}
-          release_name: v${{ steps.save_release_version.outputs.version }}
-          body: v${{ steps.save_release_version.outputs.version }}
-          draft: false
-          prerelease: false
-
-      # Notify discord if success
-      - name: Discord notification
-        env:
-          DISCORD_WEBHOOK: ${{secrets.DISCORD_WEBHOOK}}
-          DISCORD_EMBEDS: '[{"author": {"icon_url": "https://avatars.githubusercontent.com/${{ github.actor }}", "name": "${{ github.actor }}", "url": "https://github.com/${{github.actor}}"}, "url": "https://github.com/${{github.repository}}/commit/${{github.sha}}", "fields": [{ "name": "Commit Message", "value": "${{ steps.get_head_commit_message.outputs.HEAD_COMMIT_MESSAGE }}"},{"name": "Repository","value": "[${{github.event.repository.name}}](${{github.event.repository.clone_url}})","inline": true},{"name": "Branch","value": "[${{github.ref_name}}](https://github.com/${{github.repository}}/pull/${{github.ref_name}})","inline": true},{ "name": "Event", "value": "${{github.event_name}}", "inline": true },{"name": "Author","value": "[${{github.actor}}](https://github.com/${{github.actor}})","inline": true},{ "name": "Job", "value": "${{github.job}}", "inline": true },{ "name": "Version", "value": "v${{ steps.save_release_version.outputs.version }}", "inline": true},{"name": "","value": "🤖 [Github Action](https://github.com/${{ github.repository}}/actions/runs/${{ github.run_id}}) 📙 [Documentation](${{ steps.chromatic_publish.outputs.storybookUrl }}) 🎨 [Chromatic Tests](${{ steps.chromatic_publish.outputs.buildUrl }})"}],"color": 65280,"footer": { "text": "Published at ${{steps.current_time.outputs.readableTime}}" }}]'
-          DISCORD_AVATAR: 'https://github.com/qoretechnologies/reqore/blob/ae8ce24b7f0984340bf4e6835025d203d1741b3a/public/q-symbol-small.png?raw=true'
-        uses: Ilshidur/action-discord@0.3.2
-        with:
-          args: ':white_check_mark: ReQraft beta v${{ steps.save_release_version.outputs.version }} successfuly released & published.'
-        if: success()
-
-      # Notify discord if failure
-      - name: Discord notification
-        env:
-          DISCORD_WEBHOOK: ${{secrets.DISCORD_WEBHOOK}}
-          DISCORD_EMBEDS: '[{"author": {"icon_url": "https://avatars.githubusercontent.com/${{ github.actor }}", "name": "${{ github.actor }}", "url": "https://github.com/${{github.actor}}"}, "url": "https://github.com/${{github.repository}}/commit/${{github.sha}}", "fields": [{ "name": "Commit Message", "value": "${{ steps.get_head_commit_message.outputs.HEAD_COMMIT_MESSAGE }}"},{"name": "Repository","value": "[${{github.event.repository.name}}](${{github.event.repository.clone_url}})","inline": true},{"name": "Branch","value": "[${{github.ref_name}}](https://github.com/${{github.repository}}/pull/${{github.ref_name}})","inline": true},{ "name": "Event", "value": "${{github.event_name}}", "inline": true },{"name": "Author","value": "[${{github.actor}}](https://github.com/${{github.actor}})","inline": true},{ "name": "Job", "value": "${{github.job}}", "inline": true },{ "name": "Version", "value": "v${{ steps.save_release_version.outputs.version }}", "inline": true},{"name": "","value": "🤖 [Github Action](https://github.com/${{ github.repository}}/actions/runs/${{ github.run_id}})"}],"color": 16711680,"footer": { "text": "Triggered at ${{steps.current_time.outputs.readableTime}}" }}]'
-          DISCORD_AVATAR: 'https://github.com/qoretechnologies/reqore/blob/ae8ce24b7f0984340bf4e6835025d203d1741b3a/public/q-symbol-small.png?raw=true'
-        uses: Ilshidur/action-discord@0.3.2
-        with:
-          args: ':exclamation: ReQraft beta v${{ steps.save_release_version.outputs.version }} release failed! Click the GitHub Action link below to find out why.'
-        if: failure()