Skip to content

Commit

Permalink
feat: useLocalStorage Composable (#23)
Browse files Browse the repository at this point in the history
  • Loading branch information
Stuyk authored Jun 3, 2024
1 parent 65ee2ca commit 6bd9fd5
Show file tree
Hide file tree
Showing 6 changed files with 131 additions and 1 deletion.
15 changes: 15 additions & 0 deletions docs/changelog.md
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,19 @@ order: -5

# Changelog

## Version 13

### Code Changes

- Updated `upgrade` script to prevent overwriting tailwind config, or vite config
- Added `useLocalStorage` composable for getting / storing data

### Docs Changes

- Added `useLocalStorage` composable docs

---

## Version 12

### Code Changes
Expand All @@ -17,6 +30,8 @@ order: -5
- Added install instructions for Linux
- Added install instructions for Docker

---

## Version 11

### Code Changes
Expand Down
21 changes: 21 additions & 0 deletions docs/webview/composables/use-local-storage.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,21 @@
# useLocalStorage

A way to store local data to the alt:V Client.

```ts
import { useLocalStorage } from '../../../../webview/composables/useLocalStorage'

async function example() {
const localStorage = useLocalStorage();

// Set something into the local storage
localStorage.set('myKey', 'someValue')

// Get something from the local storage
const result = await localStorage.get('myKey');
console.log(`Local test result: ${result}`); // This will return `someValue`

// Remove the data based on key
await localStorage.remove('myKey');
}
```
2 changes: 1 addition & 1 deletion package.json
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
{
"author": "stuyk",
"type": "module",
"version": "12",
"version": "13",
"scripts": {
"dev": "nodemon -x pnpm start",
"dev:linux": "nodemon -x pnpm start:linux",
Expand Down
34 changes: 34 additions & 0 deletions src/main/client/webview/index.ts
Original file line number Diff line number Diff line change
Expand Up @@ -218,12 +218,46 @@ export function useWebview(path = 'http://assets/webview/index.html') {
onWebviewReadyCallbacks.push(callback);
}

/**
* Get something from the local alt storage
*
* @param {string} key
*/
function getLocalStorage(key: string) {
const data = alt.LocalStorage.get(key);
webview.emit(Events.view.localStorageGet, key, data)
}

/**
* Set data to the local alt storage
*
* @param {string} key
* @param {*} value
*/
function setLocalStorage(key: string, value: any) {
alt.LocalStorage.set(key, value);
alt.LocalStorage.save();
}

/**
* Delete something from local storage
*
* @param {string} key
*/
function deleteLocalStorage(key: string) {
alt.LocalStorage.delete(key);
alt.LocalStorage.save();
}

if (!isInitialized) {
alt.onServer(Events.view.focus, focus);
alt.onServer(Events.view.unfocus, unfocus);
alt.onServer(Events.view.hide, hide);
alt.onServer(Events.view.show, show);
alt.onServer(Events.view.onServer, emit);
webview.on(Events.view.localStorageGet, getLocalStorage);
webview.on(Events.view.localStorageSet, setLocalStorage);
webview.on(Events.view.localStorageDelete, deleteLocalStorage);
webview.on(Events.view.emitClient, handleClientEvent);
webview.on(Events.view.emitServer, handleServerEvent);
}
Expand Down
3 changes: 3 additions & 0 deletions src/main/shared/events/index.ts
Original file line number Diff line number Diff line change
Expand Up @@ -106,5 +106,8 @@ export const Events = {
unfocus: 'webview:emit:unfocus',
playFrontendSound: 'webview:play:frontend:sound',
updateMinimap: 'webview:update:minimap',
localStorageSet: 'webview:localstorage:set',
localStorageGet: 'webview:localstorage:get',
localStorageDelete: 'webview:localstorage:delete'
},
};
57 changes: 57 additions & 0 deletions webview/composables/useLocalStorage.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,57 @@
import { Events } from '../../src/main/shared/events/index.js';

const requests: { [key: string]: Function } = {};

function handleLocalStorage(key: string, value: any) {
if (!requests[key]) {
return;
}

requests[key](value);
delete requests[key];
}

export function useLocalStorage() {
function set(key: string, value: any) {
if (!('alt' in window)) {
return;
}

alt.emit(Events.view.localStorageSet, key, value);
}

async function get<T = any>(key: string): Promise<T | undefined> {
const result = await new Promise((resolve: Function) => {
const callback = (result: any) => {
return resolve(result)
}

requests[key] = callback;
if (!('alt' in window)) {
return;
}

alt.emit(Events.view.localStorageGet, key);
})

return result as T;
}

function remove(key: string) {
if (!('alt' in window)) {
return;
}

alt.emit(Events.view.localStorageDelete, key);
}

return {
get,
remove,
set,
}
}

if ('alt' in window) {
alt.on(Events.view.localStorageGet, handleLocalStorage)
}

0 comments on commit 6bd9fd5

Please sign in to comment.