Cloud Database

For Complex solution need a database storage. You can develop every app with Cloud database.

Cloud database a special mongo instance and accesible with Rest API.

You can easiliy use private database from component with extensionApi in Component Context.

import React from 'react';
import { Alert } from '@fowapps/fow-ui';
const Page = ({ ctx, extensionId }) => {
  const { extensionApi, hooks } = ctx; //You can access extensionApi
  const { useMutation, useDisclosure, useQuery } = hooks;

  return (
    <>
      <Alert description="This is awesome Page from extension"></Alert>
    </>
  );
};

export default Page;

Define Objects

You need define your models in fow-extension.json file.

{
  "name": "Awesome Extension",
  "extension": {
    "configuration": {
      "key": "configuration",
      "type": "configuration",
      "fileName": "Configuration.js"
    },
    "components": [],
    "models": {
      "Key": "awesome-extension", //For database unique key
      "Contents": {
        "Names": ["sampleData"] //You need add every object you want to use in Cloud Database
      }
    }
  }
}

info

You can use react-query hooks for best practices. For more detail click here

Add Object

var insertMutation = useMutation(
  'insertSample',
  (data) =>
    extensionApi.insertRecord(extensionId, 'sampleData', { data: data }),
  {
    onSuccess: (res) => {
      //Success insert operation
    },
    onError: () => {
      //error
    },
  },
);

Update Object

var insertMutation = useMutation(
  'insertSample',
  (data) =>
    extensionApi.updateRecord(extensionId, 'sampleData', id, { data: data }),
  {
    onSuccess: (res) => {
      //Success update operation
    },
    onError: () => {
      //error
    },
  },
);

Delete Object

var insertMutation = useMutation(
  'insertSample',
  (data) => extensionApi.deleteRecord(extensionId, 'sampleData', id),
  {
    onSuccess: (res) => {
      //Success delete operation
    },
    onError: () => {
      //error
    },
  },
);

Read Data

const sampleQuery = useQuery(
  'sampleQuery',
  () =>
    extensionApi.filterRecord(extensionId, 'sampleData', {
      skip: 0,
      limit: 500,
    }),
  {
    onSuccess: (res) => {
      //Access Data
    },
  },
);

Quering Data

You can send a comlex mongo query directly to filterRecord method.

Samples

const sampleQuery = useQuery(
    'sampleQuery',
    () =>
      extensionApi.filterRecord(extensionId, 'sampleData', {
        where:'{"name":"john"}'
        skip: 0,
        limit: 500,
      }),
    {
      onSuccess: (res) => {
        //Access Data
      },
    },
  );

Equal :

{ "Name": "John", "Surname": "Doe" }

Contains :

{ "Name": "John", "Surname": { "$regex": "Do" } }

Lte :

{ "Name": "John", "Surname": { "$regex": "Do" }, "Price": { "$lte": 100 } }

LT :

{ "Name": "John", "Surname": { "$regex": "Do" }, "Price": { "$lt": 100 } }

Equal in Array item:

{ "values4": { "$elemMatch": { "subName": "anil" } } }

Not Equal in Array item :

{ "values4": { "$elemMatch": { "subName": { "$ne": "John" } } } }

In :

{ "values5": { "$in": [12] } }

And :

{ "$and": [{ "Name": "John" }, { "Surname": "Anil" }] }

Or :

{ "$or": [{ "Name": "John" }, { "Surname": "Anil" }] }

You can check all features about Cloud Database, check this tutorial