vasceannie/nhost
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

chore: update clientStorage documentation for Capacitor and add usage examples (#2799)

Browse Source 
### **User description**
closes https://github.com/nhost/nhost/issues/2237


___

### **PR Type**
Documentation


___

### **Description**
- Enhanced `clientStorage` documentation across multiple files with
detailed usage examples.
- Added specific instructions for Capacitor versions < 4 and >= 4.
- Included new documentation file for `AuthOptions`.
- Added changesets for documentation updates.



___



### **Changes walkthrough** 📝
<table><thead><tr><th></th><th align="left">Relevant
files</th></tr></thead><tbody><tr><td><strong>Documentation</strong></td><td><details><summary>9
files</summary><table>
<tr>
  <td>
    <details>
<summary><strong>client.ts</strong><dd><code>Enhanced `clientStorage`
documentation with usage examples</code></dd></summary>
<hr>

packages/hasura-auth-js/src/types/client.ts

<li>Added detailed usage examples for different
<code>clientStorageType</code> values.<br> <li> Included specific
instructions for Capacitor versions < 4 and >= 4.<br> <li> Updated
documentation for <code>react-native</code>, <code>capacitor</code>, and
<br><code>expo-secure-store</code>.<br>


</details>


  </td>
<td><a
href="https://github.com/nhost/nhost/pull/2799/files#diff-e77914eac7c393e18a702ff5d00b5a56b48aaca2a3885b346dc2e5a0311f9357">+57/-7</a>&nbsp;
&nbsp; </td>

</tr>                    

<tr>
  <td>
    <details>
<summary><strong>five-avocados-complain.md</strong><dd><code>Added
changeset for `clientStorage` documentation update</code>&nbsp;
</dd></summary>
<hr>

.changeset/five-avocados-complain.md

- Added changeset for `@nhost/hasura-auth-js` with patch update.



</details>


  </td>
<td><a
href="https://github.com/nhost/nhost/pull/2799/files#diff-6c3685a165833aa0edc54a9104f381f53cf8885bf31cf9f55d59ab1620cb6755">+5/-0</a>&nbsp;
&nbsp; &nbsp; </td>

</tr>                    

<tr>
  <td>
    <details>
<summary><strong>orange-pears-hug.md</strong><dd><code>Added changeset
for `clientStorage` documentation update</code>&nbsp; </dd></summary>
<hr>

.changeset/orange-pears-hug.md

- Added changeset for `@nhost/docs` with patch update.



</details>


  </td>
<td><a
href="https://github.com/nhost/nhost/pull/2799/files#diff-edf648bc6f8ab396a8b121d6d4e7693b8b14f6b3c6dcc12fa3b6a5f1d831a421">+5/-0</a>&nbsp;
&nbsp; &nbsp; </td>

</tr>                    

<tr>
  <td>
    <details>

<summary><strong>nhost-auth-constructor-params.mdx</strong><dd><code>Updated
`clientStorage` documentation with examples</code>&nbsp; &nbsp; &nbsp;
&nbsp; &nbsp; &nbsp; </dd></summary>
<hr>

docs/reference/javascript/auth/types/nhost-auth-constructor-params.mdx

<li>Updated <code>clientStorage</code> documentation with detailed usage
examples.<br> <li> Included specific instructions for Capacitor versions
< 4 and >= 4.<br>


</details>


  </td>
<td><a
href="https://github.com/nhost/nhost/pull/2799/files#diff-38944ba6db61b7c7912f2ae68685c844ae6dedb355f525904dd4792dab758d45">+53/-4</a>&nbsp;
&nbsp; </td>

</tr>                    

<tr>
  <td>
    <details>
<summary><strong>auth-options.mdx</strong><dd><code>Added documentation
for `AuthOptions` with examples</code>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp;
&nbsp; </dd></summary>
<hr>

docs/reference/javascript/nhost-js/types/auth-options.mdx

<li>Added new documentation file for <code>AuthOptions</code>.<br> <li>
Included detailed usage examples for different
<code>clientStorageType</code> <br>values.<br>


</details>


  </td>
<td><a
href="https://github.com/nhost/nhost/pull/2799/files#diff-6ce5cc2ba44a9038a1184472752551f699673a894c8decde0b436c90272bedaf">+126/-0</a>&nbsp;
</td>

</tr>                    

<tr>
  <td>
    <details>

<summary><strong>nhost-client-constructor-params.mdx</strong><dd><code>Updated
`clientStorage` documentation with examples</code>&nbsp; &nbsp; &nbsp;
&nbsp; &nbsp; &nbsp; </dd></summary>
<hr>


docs/reference/javascript/nhost-js/types/nhost-client-constructor-params.mdx

<li>Updated <code>clientStorage</code> documentation with detailed usage
examples.<br> <li> Included specific instructions for Capacitor versions
< 4 and >= 4.<br>


</details>


  </td>
<td><a
href="https://github.com/nhost/nhost/pull/2799/files#diff-8c81333a5e86eff9f0b5f1fd3346e0015ea89c819640b834be308ecd38f96ccc">+53/-4</a>&nbsp;
&nbsp; </td>

</tr>                    

<tr>
  <td>
    <details>

<summary><strong>nhost-react-client-constructor-params.mdx</strong><dd><code>Updated
`clientStorage` documentation with examples</code>&nbsp; &nbsp; &nbsp;
&nbsp; &nbsp; &nbsp; </dd></summary>
<hr>

docs/reference/nextjs/types/nhost-react-client-constructor-params.mdx

<li>Updated <code>clientStorage</code> documentation with detailed usage
examples.<br> <li> Included specific instructions for Capacitor versions
< 4 and >= 4.<br>


</details>


  </td>
<td><a
href="https://github.com/nhost/nhost/pull/2799/files#diff-bc167c91b0b25533d064d93afeb6ba5417341d968ce61e73cb420d22f94bac80">+53/-4</a>&nbsp;
&nbsp; </td>

</tr>                    

<tr>
  <td>
    <details>

<summary><strong>nhost-react-client-constructor-params.mdx</strong><dd><code>Updated
`clientStorage` documentation with examples</code>&nbsp; &nbsp; &nbsp;
&nbsp; &nbsp; &nbsp; </dd></summary>
<hr>

docs/reference/react/types/nhost-react-client-constructor-params.mdx

<li>Updated <code>clientStorage</code> documentation with detailed usage
examples.<br> <li> Included specific instructions for Capacitor versions
< 4 and >= 4.<br>


</details>


  </td>
<td><a
href="https://github.com/nhost/nhost/pull/2799/files#diff-da903665c63d24af0dc6dd8f43abf5edaaececb62ab5c6d772bc9363e08dbc5c">+53/-4</a>&nbsp;
&nbsp; </td>

</tr>                    

<tr>
  <td>
    <details>

<summary><strong>nhost-vue-client-constructor-params.mdx</strong><dd><code>Updated
`clientStorage` documentation with examples</code>&nbsp; &nbsp; &nbsp;
&nbsp; &nbsp; &nbsp; </dd></summary>
<hr>

docs/reference/vue/types/nhost-vue-client-constructor-params.mdx

<li>Updated <code>clientStorage</code> documentation with detailed usage
examples.<br> <li> Included specific instructions for Capacitor versions
< 4 and >= 4.<br>


</details>


  </td>
<td><a
href="https://github.com/nhost/nhost/pull/2799/files#diff-c6d662d8a40177de1d661669c17bf0ced7385a5574dd4f2fe6159e815e697975">+53/-4</a>&nbsp;
&nbsp; </td>

</tr>                    
</table></details></td></tr></tr></tbody></table>

___

> 💡 **PR-Agent usage**:
>Comment `/help` on the PR to get a list of all available PR-Agent tools
and their descriptions

---------

Co-authored-by: Nuno Pato <nunopato@gmail.com>
This commit is contained in:
Hassan Ben Jobrane
2024-08-05 10:38:40 +01:00
committed by GitHub
parent d092a7c395
commit 45642322f4
9 changed files with 458 additions and 27 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
.changeset/five-avocados-complain.md Normal file
View File

@@ -0,0 +1,5 @@
---
'@nhost/hasura-auth-js': patch
---
chore: update `clientStorage` docs and add usage examples

5
.changeset/orange-pears-hug.md Normal file
View File

@@ -0,0 +1,5 @@
---
'@nhost/docs': patch
---
chore: update `clientStorage` docs and add usage examples

57
docs/reference/javascript/auth/types/nhost-auth-constructor-params.mdx
View File

@@ -39,14 +39,63 @@ Object where the refresh token will be persisted and read locally.
Recommended values:
- `'web'` and `'cookies'`: no value is required
- `'react-native'`: `import Storage from @react-native-async-storage/async-storage`
- `'cookies'`: `localStorage`
- `'react-native'`: use [@react-native-async-storage/async-storage](https://www.npmjs.com/package/@react-native-async-storage/async-storage)
```ts
import { NhostClient } from '@nhost/nhost-js'
import AsyncStorage from '@react-native-async-storage/async-storage';
const nhost = new NhostClient({
...
clientStorageType: 'react-native',
clientStorage: AsyncStorage
})
```
- `'custom'`: an object that defines the following methods:
- `setItem` or `setItemAsync`
- `getItem` or `getItemAsync`
- `removeItem`
- `'capacitor'`: `import { Storage } from @capacitor/storage`
- `'expo-secure-store'`: `import * as SecureStore from 'expo-secure-store'`
- `'capacitor'`:
- capacitor version **< 4** : use [@capacitor/storage](https://www.npmjs.com/package/@capacitor/storage)
```ts
import { NhostClient } from '@nhost/nhost-js'
import { Storage } from '@capacitor/storage'
const nhost = new NhostClient({
...
clientStorageType: 'capacitor',
clientStorage: Storage
})
```
- capacitor version **>= 4** : use [@capacitor/preferences](https://www.npmjs.com/package/@capacitor/preferences)
```ts
import { NhostClient } from '@nhost/nhost-js';
import { Preferences } from '@capacitor/preferences';
const nhost = new NhostClient({
...
clientStorageType: 'custom',
clientStorage: {
setItemAsync: async (key, value) => Preferences.set({ key, value }),
getItemAsync: async (key) => {
const { value } = await Preferences.get({ key });
return value;
},
removeItem(key): (key) => Preferences.remove({ key })
},
});
```
- `'expo-secure-store'`: use [expo-secure-store](https://www.npmjs.com/package/expo-secure-store)
```ts
import { NhostClient } from '@nhost/nhost-js'
import * as SecureStore from 'expo-secure-store';
const nhost = new NhostClient({
...
clientStorageType: 'expo-secure-store',
clientStorage: SecureStore
})
```
| Property | Type | Required | Notes |
| :-------------------------------------------------------------------------------------------------------- | :------------------------------------------------------------------------------------------- | :------: | :---- |

126
docs/reference/javascript/nhost-js/types/auth-options.mdx Normal file
View File

@@ -0,0 +1,126 @@
---
title: AuthOptions
sidebarTitle: AuthOptions
description: No description provided.
---
# `AuthOptions`
## Parameters
---
**<span className="parameter-name">refreshIntervalTime</span>** <span className="optional-status">optional</span> <code>number</code>
Time interval until token refreshes, in seconds
---
**<span className="parameter-name">clientStorageType</span>** <span className="optional-status">optional</span> [`ClientStorageType`](/reference/javascript/nhost-js/types/client-storage-type)
Define a way to get information about the refresh token and its expiration date.
**`@default`**
`web`
---
**<span className="parameter-name">clientStorage</span>** <span className="optional-status">optional</span> [`ClientStorage`](/reference/javascript/nhost-js/types/client-storage)
Object where the refresh token will be persisted and read locally.
Recommended values:
- `'web'` and `'cookies'`: no value is required
- `'react-native'`: use [@react-native-async-storage/async-storage](https://www.npmjs.com/package/@react-native-async-storage/async-storage)
```ts
import { NhostClient } from '@nhost/nhost-js'
import AsyncStorage from '@react-native-async-storage/async-storage';
const nhost = new NhostClient({
...
clientStorageType: 'react-native',
clientStorage: AsyncStorage
})
```
- `'custom'`: an object that defines the following methods:
- `setItem` or `setItemAsync`
- `getItem` or `getItemAsync`
- `removeItem`
- `'capacitor'`:
- capacitor version **< 4** : use [@capacitor/storage](https://www.npmjs.com/package/@capacitor/storage)
```ts
import { NhostClient } from '@nhost/nhost-js'
import { Storage } from '@capacitor/storage'
const nhost = new NhostClient({
...
clientStorageType: 'capacitor',
clientStorage: Storage
})
```
- capacitor version **>= 4** : use [@capacitor/preferences](https://www.npmjs.com/package/@capacitor/preferences)
```ts
import { NhostClient } from '@nhost/nhost-js';
import { Preferences } from '@capacitor/preferences';
const nhost = new NhostClient({
...
clientStorageType: 'custom',
clientStorage: {
setItemAsync: async (key, value) => Preferences.set({ key, value }),
getItemAsync: async (key) => {
const { value } = await Preferences.get({ key });
return value;
},
removeItem(key): (key) => Preferences.remove({ key })
},
});
```
- `'expo-secure-store'`: use [expo-secure-store](https://www.npmjs.com/package/expo-secure-store)
```ts
import { NhostClient } from '@nhost/nhost-js'
import * as SecureStore from 'expo-secure-store';
const nhost = new NhostClient({
...
clientStorageType: 'expo-secure-store',
clientStorage: SecureStore
})
```
| Property | Type | Required | Notes |
| :-------------------------------------------------------------------------------------------------------- | :------------------------------------------------------------------------------------------- | :------: | :---- |
| <span className="parameter-name"><span className="light-grey">clientStorage.</span>customSet</span> | <code>(key: string, value: null &#124; string) =&gt; void &#124; Promise&lt;void&gt;</code> | | |
| <span className="parameter-name"><span className="light-grey">clientStorage.</span>customGet</span> | <code>(key: string) =&gt; null &#124; string &#124; Promise&lt;null &#124; string&gt;</code> | | |
| <span className="parameter-name"><span className="light-grey">clientStorage.</span>deleteItemAsync</span> | <code>(key: string) =&gt; void</code> | | |
| <span className="parameter-name"><span className="light-grey">clientStorage.</span>getItemAsync</span> | <code>(key: string) =&gt; any</code> | | |
| <span className="parameter-name"><span className="light-grey">clientStorage.</span>setItemAsync</span> | <code>(key: string, value: string) =&gt; void</code> | | |
| <span className="parameter-name"><span className="light-grey">clientStorage.</span>remove</span> | <code>(options: &#123; key: string &#125;) =&gt; void</code> | | |
| <span className="parameter-name"><span className="light-grey">clientStorage.</span>get</span> | <code>(options: &#123; key: string &#125;) =&gt; any</code> | | |
| <span className="parameter-name"><span className="light-grey">clientStorage.</span>set</span> | <code>(options: &#123; key: string, value: string &#125;) =&gt; void</code> | | |
| <span className="parameter-name"><span className="light-grey">clientStorage.</span>removeItem</span> | <code>(key: string) =&gt; void</code> | | |
| <span className="parameter-name"><span className="light-grey">clientStorage.</span>getItem</span> | <code>(key: string) =&gt; any</code> | | |
| <span className="parameter-name"><span className="light-grey">clientStorage.</span>setItem</span> | <code>(\_key: string, \_value: string) =&gt; void</code> | | |
---
**<span className="parameter-name">autoRefreshToken</span>** <span className="optional-status">optional</span> <code>boolean</code>
When set to true, will automatically refresh token before it expires
---
**<span className="parameter-name">autoSignIn</span>** <span className="optional-status">optional</span> <code>boolean</code>
When set to true, will parse the url on startup to check if it contains a refresh token to start the session with
---
**<span className="parameter-name">devTools</span>** <span className="optional-status">optional</span> <code>boolean</code>
Activate devTools e.g. the ability to connect to the xstate inspector
---

57
docs/reference/javascript/nhost-js/types/nhost-client-constructor-params.mdx
View File

@@ -37,14 +37,63 @@ Object where the refresh token will be persisted and read locally.
Recommended values:
- `'web'` and `'cookies'`: no value is required
- `'react-native'`: `import Storage from @react-native-async-storage/async-storage`
- `'cookies'`: `localStorage`
- `'react-native'`: use [@react-native-async-storage/async-storage](https://www.npmjs.com/package/@react-native-async-storage/async-storage)
```ts
import { NhostClient } from '@nhost/nhost-js'
import AsyncStorage from '@react-native-async-storage/async-storage';
const nhost = new NhostClient({
...
clientStorageType: 'react-native',
clientStorage: AsyncStorage
})
```
- `'custom'`: an object that defines the following methods:
- `setItem` or `setItemAsync`
- `getItem` or `getItemAsync`
- `removeItem`
- `'capacitor'`: `import { Storage } from @capacitor/storage`
- `'expo-secure-store'`: `import * as SecureStore from 'expo-secure-store'`
- `'capacitor'`:
- capacitor version **< 4** : use [@capacitor/storage](https://www.npmjs.com/package/@capacitor/storage)
```ts
import { NhostClient } from '@nhost/nhost-js'
import { Storage } from '@capacitor/storage'
const nhost = new NhostClient({
...
clientStorageType: 'capacitor',
clientStorage: Storage
})
```
- capacitor version **>= 4** : use [@capacitor/preferences](https://www.npmjs.com/package/@capacitor/preferences)
```ts
import { NhostClient } from '@nhost/nhost-js';
import { Preferences } from '@capacitor/preferences';
const nhost = new NhostClient({
...
clientStorageType: 'custom',
clientStorage: {
setItemAsync: async (key, value) => Preferences.set({ key, value }),
getItemAsync: async (key) => {
const { value } = await Preferences.get({ key });
return value;
},
removeItem(key): (key) => Preferences.remove({ key })
},
});
```
- `'expo-secure-store'`: use [expo-secure-store](https://www.npmjs.com/package/expo-secure-store)
```ts
import { NhostClient } from '@nhost/nhost-js'
import * as SecureStore from 'expo-secure-store';
const nhost = new NhostClient({
...
clientStorageType: 'expo-secure-store',
clientStorage: SecureStore
})
```
| Property | Type | Required | Notes |
| :-------------------------------------------------------------------------------------------------------- | :------------------------------------------------------------------------------------------- | :------: | :---- |

57
docs/reference/nextjs/types/nhost-react-client-constructor-params.mdx
View File

@@ -33,14 +33,63 @@ Object where the refresh token will be persisted and read locally.
Recommended values:
- `'web'` and `'cookies'`: no value is required
- `'react-native'`: `import Storage from @react-native-async-storage/async-storage`
- `'cookies'`: `localStorage`
- `'react-native'`: use [@react-native-async-storage/async-storage](https://www.npmjs.com/package/@react-native-async-storage/async-storage)
```ts
import { NhostClient } from '@nhost/nhost-js'
import AsyncStorage from '@react-native-async-storage/async-storage';
const nhost = new NhostClient({
...
clientStorageType: 'react-native',
clientStorage: AsyncStorage
})
```
- `'custom'`: an object that defines the following methods:
- `setItem` or `setItemAsync`
- `getItem` or `getItemAsync`
- `removeItem`
- `'capacitor'`: `import { Storage } from @capacitor/storage`
- `'expo-secure-store'`: `import * as SecureStore from 'expo-secure-store'`
- `'capacitor'`:
- capacitor version **< 4** : use [@capacitor/storage](https://www.npmjs.com/package/@capacitor/storage)
```ts
import { NhostClient } from '@nhost/nhost-js'
import { Storage } from '@capacitor/storage'
const nhost = new NhostClient({
...
clientStorageType: 'capacitor',
clientStorage: Storage
})
```
- capacitor version **>= 4** : use [@capacitor/preferences](https://www.npmjs.com/package/@capacitor/preferences)
```ts
import { NhostClient } from '@nhost/nhost-js';
import { Preferences } from '@capacitor/preferences';
const nhost = new NhostClient({
...
clientStorageType: 'custom',
clientStorage: {
setItemAsync: async (key, value) => Preferences.set({ key, value }),
getItemAsync: async (key) => {
const { value } = await Preferences.get({ key });
return value;
},
removeItem(key): (key) => Preferences.remove({ key })
},
});
```
- `'expo-secure-store'`: use [expo-secure-store](https://www.npmjs.com/package/expo-secure-store)
```ts
import { NhostClient } from '@nhost/nhost-js'
import * as SecureStore from 'expo-secure-store';
const nhost = new NhostClient({
...
clientStorageType: 'expo-secure-store',
clientStorage: SecureStore
})
```
---

57
docs/reference/react/types/nhost-react-client-constructor-params.mdx
View File

@@ -72,14 +72,63 @@ Object where the refresh token will be persisted and read locally.
Recommended values:
- `'web'` and `'cookies'`: no value is required
- `'react-native'`: `import Storage from @react-native-async-storage/async-storage`
- `'cookies'`: `localStorage`
- `'react-native'`: use [@react-native-async-storage/async-storage](https://www.npmjs.com/package/@react-native-async-storage/async-storage)
```ts
import { NhostClient } from '@nhost/nhost-js'
import AsyncStorage from '@react-native-async-storage/async-storage';
const nhost = new NhostClient({
...
clientStorageType: 'react-native',
clientStorage: AsyncStorage
})
```
- `'custom'`: an object that defines the following methods:
- `setItem` or `setItemAsync`
- `getItem` or `getItemAsync`
- `removeItem`
- `'capacitor'`: `import { Storage } from @capacitor/storage`
- `'expo-secure-store'`: `import * as SecureStore from 'expo-secure-store'`
- `'capacitor'`:
- capacitor version **< 4** : use [@capacitor/storage](https://www.npmjs.com/package/@capacitor/storage)
```ts
import { NhostClient } from '@nhost/nhost-js'
import { Storage } from '@capacitor/storage'
const nhost = new NhostClient({
...
clientStorageType: 'capacitor',
clientStorage: Storage
})
```
- capacitor version **>= 4** : use [@capacitor/preferences](https://www.npmjs.com/package/@capacitor/preferences)
```ts
import { NhostClient } from '@nhost/nhost-js';
import { Preferences } from '@capacitor/preferences';
const nhost = new NhostClient({
...
clientStorageType: 'custom',
clientStorage: {
setItemAsync: async (key, value) => Preferences.set({ key, value }),
getItemAsync: async (key) => {
const { value } = await Preferences.get({ key });
return value;
},
removeItem(key): (key) => Preferences.remove({ key })
},
});
```
- `'expo-secure-store'`: use [expo-secure-store](https://www.npmjs.com/package/expo-secure-store)
```ts
import { NhostClient } from '@nhost/nhost-js'
import * as SecureStore from 'expo-secure-store';
const nhost = new NhostClient({
...
clientStorageType: 'expo-secure-store',
clientStorage: SecureStore
})
```
---

57
docs/reference/vue/types/nhost-vue-client-constructor-params.mdx
View File

@@ -72,14 +72,63 @@ Object where the refresh token will be persisted and read locally.
Recommended values:
- `'web'` and `'cookies'`: no value is required
- `'react-native'`: `import Storage from @react-native-async-storage/async-storage`
- `'cookies'`: `localStorage`
- `'react-native'`: use [@react-native-async-storage/async-storage](https://www.npmjs.com/package/@react-native-async-storage/async-storage)
```ts
import { NhostClient } from '@nhost/nhost-js'
import AsyncStorage from '@react-native-async-storage/async-storage';
const nhost = new NhostClient({
...
clientStorageType: 'react-native',
clientStorage: AsyncStorage
})
```
- `'custom'`: an object that defines the following methods:
- `setItem` or `setItemAsync`
- `getItem` or `getItemAsync`
- `removeItem`
- `'capacitor'`: `import { Storage } from @capacitor/storage`
- `'expo-secure-store'`: `import * as SecureStore from 'expo-secure-store'`
- `'capacitor'`:
- capacitor version **< 4** : use [@capacitor/storage](https://www.npmjs.com/package/@capacitor/storage)
```ts
import { NhostClient } from '@nhost/nhost-js'
import { Storage } from '@capacitor/storage'
const nhost = new NhostClient({
...
clientStorageType: 'capacitor',
clientStorage: Storage
})
```
- capacitor version **>= 4** : use [@capacitor/preferences](https://www.npmjs.com/package/@capacitor/preferences)
```ts
import { NhostClient } from '@nhost/nhost-js';
import { Preferences } from '@capacitor/preferences';
const nhost = new NhostClient({
...
clientStorageType: 'custom',
clientStorage: {
setItemAsync: async (key, value) => Preferences.set({ key, value }),
getItemAsync: async (key) => {
const { value } = await Preferences.get({ key });
return value;
},
removeItem(key): (key) => Preferences.remove({ key })
},
});
```
- `'expo-secure-store'`: use [expo-secure-store](https://www.npmjs.com/package/expo-secure-store)
```ts
import { NhostClient } from '@nhost/nhost-js'
import * as SecureStore from 'expo-secure-store';
const nhost = new NhostClient({
...
clientStorageType: 'expo-secure-store',
clientStorage: SecureStore
})
```
---

64
packages/hasura-auth-js/src/types/client.ts
View File

@@ -128,15 +128,65 @@ export interface AuthOptions {
/** Object where the refresh token will be persisted and read locally.
*
* Recommended values:
*
* - `'web'` and `'cookies'`: no value is required
* - `'react-native'`: `import Storage from @react-native-async-storage/async-storage`
* - `'cookies'`: `localStorage`
* - `'react-native'`: use [@react-native-async-storage/async-storage](https://www.npmjs.com/package/@react-native-async-storage/async-storage)
* ```ts
* import { NhostClient } from '@nhost/nhost-js'
* import AsyncStorage from '@react-native-async-storage/async-storage';
* const nhost = new NhostClient({
* ...
* clientStorageType: 'react-native',
* clientStorage: AsyncStorage
* })
* ```
* - `'custom'`: an object that defines the following methods:
* - `setItem` or `setItemAsync`
* - `getItem` or `getItemAsync`
* - `removeItem`
* - `'capacitor'`: `import { Storage } from @capacitor/storage`
* - `'expo-secure-store'`: `import * as SecureStore from 'expo-secure-store'`
* - `setItem` or `setItemAsync`
* - `getItem` or `getItemAsync`
* - `removeItem`
* - `'capacitor'`:
*
* - capacitor version **< 4** : use [@capacitor/storage](https://www.npmjs.com/package/@capacitor/storage)
*
* ```ts
* import { NhostClient } from '@nhost/nhost-js'
* import { Storage } from '@capacitor/storage'
* const nhost = new NhostClient({
* ...
* clientStorageType: 'capacitor',
* clientStorage: Storage
* })
* ```
*
* - capacitor version **>= 4** : use [@capacitor/preferences](https://www.npmjs.com/package/@capacitor/preferences)
*
* ```ts
* import { NhostClient } from '@nhost/nhost-js';
* import { Preferences } from '@capacitor/preferences';
* const nhost = new NhostClient({
* ...
* clientStorageType: 'custom',
* clientStorage: {
* setItemAsync: async (key, value) => Preferences.set({ key, value }),
* getItemAsync: async (key) => {
* const { value } = await Preferences.get({ key });
* return value;
* },
* removeItem: (key) => Preferences.remove({ key })
* },
* });
* ```
*
* - `'expo-secure-store'`: use [expo-secure-store](https://www.npmjs.com/package/expo-secure-store)
* ```ts
* import { NhostClient } from '@nhost/nhost-js'
* import * as SecureStore from 'expo-secure-store';
* const nhost = new NhostClient({
* ...
* clientStorageType: 'expo-secure-store',
* clientStorage: SecureStore
* })
* ```
*/
clientStorage?: ClientStorage
/**