Axioswal NPM | npm.io

axioswal

Installation

npm install axioswal

Usage

swalaxios = require('swalaxios');

`axioswal(axios[, swal[, config]])`

axioswal takes 3 arguments:

The first argument is axios request config: axios
The second argument is SweetAlert2 config: swal
The third argument is axioswal config: config

axioswal({
  //  axios config
  url: 'http://example.com/api',
  method: 'post'
}, {
  //  swal config
  position: 'top-end',
  timer: 1500
}, {
  //  swalaxios config
  check: (data) => (data.myApiStatus === 'success') //  considered the request a success if the response data has myApiStatus === 'success' or a failure otherwise.
  text: (data) => data.myApiMessage
});

Aliases

For convenience, if you are not planning to have axios config, you can use the following methods:

`axioswal.get(url[, swal[, config]])`

`axioswal.delete(url[, swal[, config]])`

`axioswal.head(url[, swal[, config]])`

`axioswal.options(url[, swal[, config]])`

`axioswal.post(url[, data[, swal[, config]]])`

`axioswal.put(url[, data[, swal[, config]]])`

`axioswal.patch(url[, data[, swal[, config]]])`

Configuration

config is the last argument in axioswal(), which accepts the properties in the table below. Please note that data refers to axios's response.data.

options	description	default
check	Custom function that takes one argument: `data`, to consider the response as a success or failure. This should returns either `true` or `false`	`defaultCheckFunc`
text	Custom function that takes two arguments: `data`, `ok` (`true` or `false`) and returns the user-readable text (message). This should returns a `string`.	`defaultTextFunc`
noSwal	Do not show sweetalert2.	`false`

default functions

defaultCheckFunc

By default, defaultCheckFunc will returns false (the request is considered a failure) if the response data satisfies any of the conditions below:

response.error key exists.
response.status === 'error'
response.ok === false
response.success === false

Is there any other common response schema? Make a PR!

Request is always considered a failure if it isAxiosError (such as 4xx and 5xx error)

defaultTextFunc

By default, defaultTextFunc will attempt to read from the following (prioritized from top to bottom):

response.error.message (in case of failed request)
response.error.msg (in case of failed request)
response.error if it is a string (in case of failed request)
response.message
response.msg
response.text
response if it is not a JSON response.
'Success!' or 'An error has occurred.' depends on whether the request is considered successful.

Is there any other common response schema? Make a PR!

`axioswal` returns promise

axioswal() always returns a promise which resolves to axios's response.data. (even in isAxiosError).

//  Example of a sign in form in `React` (with Hooks)
const handleSubmit = (event) => {
  event.preventDefault();
  axioswal
    .post("/api/authenticate", {
      email,
      password
    })
    .then((data) => {
      if (data.status === false) {
        //  empty password field if incorrect credentials
        setPassword('');
      }
      else {
        //  redirect if log in is a success
        window.location = '/';
      }
    });
};