Skip to content

Commit 47b56d7

Browse files
authored
Merge pull request #118 from cmolisee/117-minor-qol-updates
117 minor qol updates
2 parents 82af20e + eb489af commit 47b56d7

File tree

12 files changed

+125
-43
lines changed

12 files changed

+125
-43
lines changed

.wxt/types/imports.d.ts

Lines changed: 26 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -1,26 +1,26 @@
11
// Generated by wxt
22
export {}
33
declare global {
4-
const AVAILABLE_THEMES: typeof import('/Users/codymolisee/Documents/session-storage-hub/src/utils/constants')['AVAILABLE_THEMES']
4+
const AVAILABLE_THEMES: typeof import('/Users/cmolisee/Documents/session-storage-hub/src/utils/constants')['AVAILABLE_THEMES']
55
const ContentScriptContext: typeof import('wxt/client')['ContentScriptContext']
66
const Dynamic: typeof import('solid-js/web')['Dynamic']
7-
const EXTENSION_ACTIONS: typeof import('/Users/codymolisee/Documents/session-storage-hub/src/utils/constants')['EXTENSION_ACTIONS']
7+
const EXTENSION_ACTIONS: typeof import('/Users/cmolisee/Documents/session-storage-hub/src/utils/constants')['EXTENSION_ACTIONS']
88
const ErrorBoundary: typeof import('solid-js')['ErrorBoundary']
9-
const ExtensionProvider: typeof import('/Users/codymolisee/Documents/session-storage-hub/src/hooks/useExtensionOptions')['ExtensionProvider']
9+
const ExtensionProvider: typeof import('/Users/cmolisee/Documents/session-storage-hub/src/hooks/useExtensionOptions')['ExtensionProvider']
1010
const For: typeof import('solid-js')['For']
1111
const Index: typeof import('solid-js')['Index']
1212
const InvalidMatchPattern: typeof import('wxt/sandbox')['InvalidMatchPattern']
13-
const MESSAGE_NAMESPACES: typeof import('/Users/codymolisee/Documents/session-storage-hub/src/utils/constants')['MESSAGE_NAMESPACES']
13+
const MESSAGE_NAMESPACES: typeof import('/Users/cmolisee/Documents/session-storage-hub/src/utils/constants')['MESSAGE_NAMESPACES']
1414
const Match: typeof import('solid-js')['Match']
1515
const MatchPattern: typeof import('wxt/sandbox')['MatchPattern']
1616
const MigrationError: typeof import('wxt/storage')['MigrationError']
1717
const Portal: typeof import('solid-js/web')['Portal']
1818
const Show: typeof import('solid-js')['Show']
19-
const StorageProvider: typeof import('/Users/codymolisee/Documents/session-storage-hub/src/hooks/useStorage')['StorageProvider']
19+
const StorageProvider: typeof import('/Users/cmolisee/Documents/session-storage-hub/src/hooks/useStorage')['StorageProvider']
2020
const Suspense: typeof import('solid-js')['Suspense']
2121
const SuspenseList: typeof import('solid-js')['SuspenseList']
2222
const Switch: typeof import('solid-js')['Switch']
23-
const WEBPAGE_ACTIONS: typeof import('/Users/codymolisee/Documents/session-storage-hub/src/utils/constants')['WEBPAGE_ACTIONS']
23+
const WEBPAGE_ACTIONS: typeof import('/Users/cmolisee/Documents/session-storage-hub/src/utils/constants')['WEBPAGE_ACTIONS']
2424
const batch: typeof import('solid-js')['batch']
2525
const browser: typeof import('wxt/browser/chrome')['browser']
2626
const children: typeof import('solid-js')['children']
@@ -38,29 +38,30 @@ declare global {
3838
const createShadowRootUi: typeof import('wxt/client')['createShadowRootUi']
3939
const createSignal: typeof import('solid-js')['createSignal']
4040
const createStore: typeof import('solid-js/store')['createStore']
41-
const deepCopy: typeof import('/Users/codymolisee/Documents/session-storage-hub/src/utils/utils')['deepCopy']
41+
const deepCopy: typeof import('/Users/cmolisee/Documents/session-storage-hub/src/utils/utils')['deepCopy']
4242
const defineAppConfig: typeof import('wxt/sandbox')['defineAppConfig']
4343
const defineBackground: typeof import('wxt/sandbox')['defineBackground']
4444
const defineConfig: typeof import('wxt')['defineConfig']
4545
const defineContentScript: typeof import('wxt/sandbox')['defineContentScript']
4646
const defineUnlistedScript: typeof import('wxt/sandbox')['defineUnlistedScript']
4747
const defineWxtPlugin: typeof import('wxt/sandbox')['defineWxtPlugin']
48-
const extensionClipboard: typeof import('/Users/codymolisee/Documents/session-storage-hub/src/utils/storage')['extensionClipboard']
49-
const extensionData: typeof import('/Users/codymolisee/Documents/session-storage-hub/src/utils/storage')['extensionData']
50-
const extensionMessenger: typeof import('/Users/codymolisee/Documents/session-storage-hub/src/utils/messaging')['extensionMessenger']
51-
const extensionOptions: typeof import('/Users/codymolisee/Documents/session-storage-hub/src/utils/storage')['extensionOptions']
48+
const extensionClipboard: typeof import('/Users/cmolisee/Documents/session-storage-hub/src/utils/storage')['extensionClipboard']
49+
const extensionData: typeof import('/Users/cmolisee/Documents/session-storage-hub/src/utils/storage')['extensionData']
50+
const extensionMessenger: typeof import('/Users/cmolisee/Documents/session-storage-hub/src/utils/messaging')['extensionMessenger']
51+
const extensionOptions: typeof import('/Users/cmolisee/Documents/session-storage-hub/src/utils/storage')['extensionOptions']
5252
const fakeBrowser: typeof import('wxt/testing')['fakeBrowser']
53-
const getEditorTheme: typeof import('/Users/codymolisee/Documents/session-storage-hub/src/utils/theme')['getEditorTheme']
54-
const getErrorPosition: typeof import('/Users/codymolisee/Documents/session-storage-hub/src/utils/utils')['getErrorPosition']
55-
const getThemeStyles: typeof import('/Users/codymolisee/Documents/session-storage-hub/src/utils/theme')['getThemeStyles']
53+
const getEditorTheme: typeof import('/Users/cmolisee/Documents/session-storage-hub/src/utils/theme')['getEditorTheme']
54+
const getErrorPosition: typeof import('/Users/cmolisee/Documents/session-storage-hub/src/utils/utils')['getErrorPosition']
55+
const getThemeStyles: typeof import('/Users/cmolisee/Documents/session-storage-hub/src/utils/theme')['getThemeStyles']
5656
const hydrate: typeof import('solid-js/web')['hydrate']
5757
const indexArray: typeof import('solid-js')['indexArray']
5858
const injectScript: typeof import('wxt/client')['injectScript']
5959
const isServer: typeof import('solid-js/web')['isServer']
60-
const jsonFormat: typeof import('/Users/codymolisee/Documents/session-storage-hub/src/utils/utils')['jsonFormat']
60+
const jsonFormat: typeof import('/Users/cmolisee/Documents/session-storage-hub/src/utils/utils')['jsonFormat']
6161
const lazy: typeof import('solid-js')['lazy']
6262
const mapArray: typeof import('solid-js')['mapArray']
6363
const mergeProps: typeof import('solid-js')['mergeProps']
64+
const notification: typeof import('/Users/cmolisee/Documents/session-storage-hub/src/utils/utils')['notification']
6465
const observable: typeof import('solid-js')['observable']
6566
const on: typeof import('solid-js')['on']
6667
const onCleanup: typeof import('solid-js')['onCleanup']
@@ -72,25 +73,25 @@ declare global {
7273
const renderToStream: typeof import('solid-js/web')['renderToStream']
7374
const renderToString: typeof import('solid-js/web')['renderToString']
7475
const renderToStringAsync: typeof import('solid-js/web')['renderToStringAsync']
75-
const safeParse: typeof import('/Users/codymolisee/Documents/session-storage-hub/src/utils/utils')['safeParse']
76+
const safeParse: typeof import('/Users/cmolisee/Documents/session-storage-hub/src/utils/utils')['safeParse']
7677
const splitProps: typeof import('solid-js')['splitProps']
7778
const storage: typeof import('wxt/storage')['storage']
78-
const tailwindMerge: typeof import('/Users/codymolisee/Documents/session-storage-hub/src/utils/utils')['tailwindMerge']
79-
const themeOptions: typeof import('/Users/codymolisee/Documents/session-storage-hub/src/utils/theme')['themeOptions']
79+
const tailwindMerge: typeof import('/Users/cmolisee/Documents/session-storage-hub/src/utils/utils')['tailwindMerge']
80+
const themeOptions: typeof import('/Users/cmolisee/Documents/session-storage-hub/src/utils/theme')['themeOptions']
8081
const untrack: typeof import('solid-js')['untrack']
8182
const useAppConfig: typeof import('wxt/client')['useAppConfig']
8283
const useContext: typeof import('solid-js')['useContext']
83-
const useExtensionOptions: typeof import('/Users/codymolisee/Documents/session-storage-hub/src/hooks/useExtensionOptions')['useExtensionOptions']
84-
const useStorage: typeof import('/Users/codymolisee/Documents/session-storage-hub/src/hooks/useStorage')['useStorage']
84+
const useExtensionOptions: typeof import('/Users/cmolisee/Documents/session-storage-hub/src/hooks/useExtensionOptions')['useExtensionOptions']
85+
const useStorage: typeof import('/Users/cmolisee/Documents/session-storage-hub/src/hooks/useStorage')['useStorage']
8586
const useTransition: typeof import('solid-js')['useTransition']
86-
const windowMessenger: typeof import('/Users/codymolisee/Documents/session-storage-hub/src/utils/windowMessaging')['windowMessenger']
87+
const windowMessenger: typeof import('/Users/cmolisee/Documents/session-storage-hub/src/utils/windowMessaging')['windowMessenger']
8788
}
8889
// for type re-export
8990
declare global {
9091
// @ts-ignore
91-
export type { MESSAGE_NAMESPACES, WEBPAGE_ACTIONS, EXTENSION_ACTIONS, AVAILABLE_THEMES } from '/Users/codymolisee/Documents/session-storage-hub/src/utils/constants'
92-
import('/Users/codymolisee/Documents/session-storage-hub/src/utils/constants')
92+
export type { MESSAGE_NAMESPACES, WEBPAGE_ACTIONS, EXTENSION_ACTIONS, AVAILABLE_THEMES } from '/Users/cmolisee/Documents/session-storage-hub/src/utils/constants'
93+
import('/Users/cmolisee/Documents/session-storage-hub/src/utils/constants')
9394
// @ts-ignore
94-
export type { WebsiteMessengerSchema } from '/Users/codymolisee/Documents/session-storage-hub/src/utils/windowMessaging'
95-
import('/Users/codymolisee/Documents/session-storage-hub/src/utils/windowMessaging')
95+
export type { WebsiteMessengerSchema } from '/Users/cmolisee/Documents/session-storage-hub/src/utils/windowMessaging'
96+
import('/Users/cmolisee/Documents/session-storage-hub/src/utils/windowMessaging')
9697
}

package-lock.json

Lines changed: 10 additions & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

package.json

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -100,7 +100,8 @@
100100
"@uiw/codemirror-theme-tokyo-night-storm": "^4.23.6",
101101
"@webext-core/messaging": "^2.1.0",
102102
"codemirror": "^6.0.1",
103-
"solid-js": "^1.9.3"
103+
"solid-js": "^1.9.3",
104+
"solid-toast": "^0.5.0"
104105
},
105106
"devDependencies": {
106107
"@semantic-release/changelog": "^6.0.3",

src/components/ViewGridValue/index.tsx

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@ import { crosshairCursor, drawSelection, dropCursor, highlightActiveLine, highli
77
import { EditorState } from "@codemirror/state";
88
import { autocompletion, closeBrackets, closeBracketsKeymap, completionKeymap } from "@codemirror/autocomplete";
99
import { defaultKeymap, history, historyKeymap } from "@codemirror/commands";
10-
import { bracketMatching, defaultHighlightStyle, foldGutter, foldKeymap, indentOnInput, syntaxHighlighting } from "@codemirror/language";
10+
import { bracketMatching, defaultHighlightStyle, foldGutter, foldKeymap, indentOnInput, indentUnit, syntaxHighlighting } from "@codemirror/language";
1111
import { highlightSelectionMatches, searchKeymap } from "@codemirror/search";
1212
import { editorPanel } from "../EditorPanelEffect";
1313
import { jsonFormat } from "@/utils/utils";
@@ -87,6 +87,7 @@ export default function ViewGridValue(props: any) {
8787
]));
8888
extension(EditorView.lineWrapping);
8989
extension(json());
90+
extension(indentUnit.of(' '));
9091
extension(lintGutter());
9192
extension(editorLinter);
9293

src/entrypoints/background.ts

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -27,4 +27,18 @@ export default defineBackground(() => {
2727
return false;
2828
});
2929
});
30+
31+
/**
32+
* whenever the active tab is changed, send a request to get that tabs session
33+
* storage and update the extension data.
34+
*/
35+
browser.tabs.onActivated.addListener(async (activeInfo) => {
36+
console.log(activeInfo);
37+
return await extensionMessenger.sendMessage('requestUpdate', undefined, activeInfo.tabId)
38+
.then(() => true)
39+
.catch((error) => {
40+
console.debug(error);
41+
return false;
42+
});
43+
})
3044
});

src/entrypoints/content.ts

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -28,6 +28,16 @@ export default defineContentScript({
2828
});
2929
});
3030

31+
/** Receive update request because activeTab has changed and pass to webpage */
32+
extensionMessenger.onMessage('requestUpdate', async (message) => {
33+
return await windowMessenger.sendMessage('getUpdate', undefined)
34+
.then(() => true)
35+
.catch((error) => {
36+
console.debug(error);
37+
return false;
38+
});
39+
});
40+
3141
init();
3242
},
3343
});

src/entrypoints/inject.ts

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -18,9 +18,22 @@ export default defineUnlistedScript(() => {
1818
return true;
1919
});
2020

21+
/**
22+
* Receive a request from the background script to update session storage.
23+
* This request happens on activeTab change.
24+
* When received, respond by sending an updateToExtension message which
25+
* will pass the pages session data back to the extension.
26+
*/
27+
windowMessenger.onMessage('getUpdate', () => {
28+
windowMessenger.sendMessage('updateToExtension', deepCopy(window.sessionStorage))
29+
.catch((error) => console.debug(error));
30+
return true;
31+
});
32+
2133
const sessionDataUpdateToExtension = (e: any) => {
2234
windowMessenger.sendMessage('updateToExtension', deepCopy(e.storageArea))
2335
.catch((error) => console.debug(error));
36+
return true;
2437
};
2538

2639
window.removeEventListener('storage', sessionDataUpdateToExtension);

src/entrypoints/popup/popup.tsx

Lines changed: 13 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,9 @@ import Control from '@/components/control';
33
import ViewGrid from '@/components/ViewGrid';
44
import { storage as wxtStorage } from '@wxt-dev/storage';
55
import Tooltip from '@/components/tooltip';
6+
import { version } from '../../../package.json';
7+
import { Toaster } from 'solid-toast';
8+
import { notification } from '@/utils/utils';
69

710
function Popup() {
811
const { storage, setSessionStorageData, selectAllKeys, unselectAllKeys } = useStorage();
@@ -17,36 +20,44 @@ function Popup() {
1720
}
1821

1922
await extensionClipboard.setValue(dataToCopy)
23+
.then(() => notification('Session Storage Data Copied.'))
2024
.catch((error) => console.debug('Failed to set extensionClipboard:', error));
2125
}
2226

2327
const pasteCallback = async () => {
2428
const dataToPaste = await extensionClipboard.getValue()
29+
.then(() => notification('Session Storage Data Pasted.'))
2530
.catch((error) => console.debug('Failed to get extensionClipboard:', error));
2631

2732
await extensionMessenger.sendMessage('sendToBackground', dataToPaste)
33+
.then(() => notification('Session Storage on webpage has been updated.'))
2834
.catch((error) => console.debug(error));
2935
}
3036

3137
const addCallback = async () => {
3238
const newKey = new Date().getTime().toString();
3339
const dataToAdd = deepCopy(storage.sessionStorageData);
3440
Object.assign(dataToAdd, { [newKey]: '{}' });
41+
notification(`New key-value pair added with key: ${newKey}.`);
3542

3643
await extensionMessenger.sendMessage('sendToBackground', dataToAdd)
44+
.then(() => notification('Session Storage on webpage has been updated.'))
3745
.catch((error) => console.debug(error));
3846
}
3947

4048
const deleteCallback = async () => {
4149
const dataUpdate = deepCopy(storage.sessionStorageData);
50+
notification(`key: ${storage.activeKey} has been deleted.`);
4251
delete dataUpdate[storage.activeKey];
4352

4453
await extensionMessenger.sendMessage('sendToBackground', dataUpdate)
54+
.then(() => notification('Session Storage on webpage has been updated.'))
4555
.catch((error) => console.debug(error));
4656
}
4757

4858
const clearCallback = async () => {
4959
await extensionMessenger.sendMessage('sendToBackground', {})
60+
.then(() => notification('Session Storage has been cleared.'))
5061
.catch((error) => console.debug(error));
5162
}
5263

@@ -114,9 +125,10 @@ function Popup() {
114125
</div>
115126
</div>
116127
<ViewGrid />
128+
<Toaster />
117129
<div class={'flex m-1 justify-start text-[var(--borderColor)]'}>
118130
<div class={'cursor-default mr-4'}>
119-
TODO: import extension version
131+
{version}
120132
</div>
121133
</div>
122134
</>

src/hooks/useStorage.tsx

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
11
import { IStorageContext, IStorageShape } from "@/types/hooks";
2+
import { notification } from "@/utils/utils";
23

34
const initialStorage: IStorageShape = {
45
sessionStorageData: {},
@@ -74,13 +75,15 @@ export const StorageProvider = (props: any) => {
7475
* Set selectedKeys in storage to array of all availalbe keys.
7576
*/
7677
const selectAllKeys = () => {
78+
notification('All keys selected.');
7779
setStore('selectedKeys', deepCopy(store.keys) );
7880
};
7981

8082
/**
8183
* Set selectedKeys in storage to empty array.
8284
*/
8385
const unselectAllKeys = () => {
86+
notification('All keys unselected.');
8487
setStore('selectedKeys', []);
8588
};
8689

src/utils/messaging.ts

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -2,9 +2,10 @@ import { defineExtensionMessaging } from "@webext-core/messaging";
22

33
/** Protocol for extension messages */
44
interface ProtocolMap {
5-
sendToBackground(data: any): boolean // send session data to the background script
6-
sendToContent(data: any): boolean // send session data from background to content script
7-
updateFromPage(data: any): boolean // receive session data update from content script
5+
sendToBackground(data: any): boolean; // send session data to the background script
6+
sendToContent(data: any): boolean; // send session data from background to content script
7+
updateFromPage(data: any): boolean; // receive session data update from content script
8+
requestUpdate(): boolean; // request an update from the page
89
}
910

1011
/**

0 commit comments

Comments
 (0)