Skip to content

Commit 4ea95c0

Browse files
committed
Update README.
1 parent 113586c commit 4ea95c0

File tree

1 file changed

+14
-5
lines changed

1 file changed

+14
-5
lines changed

browser-extension/README.md

Lines changed: 14 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -31,17 +31,26 @@ This is a [WXT](https://wxt.dev/)-based browser extension that
3131
- finds `textarea` components and decorates them with [overtype](https://overtype.dev/) and [highlight.js](https://highlightjs.org/)
3232
- stores unposted comment drafts, and makes them easy to find via the extension popup
3333

34+
### Tech Stack
35+
36+
- **Framework**: [WXT](https://wxt.dev/) for browser extension development
37+
- **UI**: React with TypeScript JSX
38+
- **Styling**: Tailwind CSS v4 (with first-party Vite plugin)
39+
- **Components**: shadcn/ui for table components
40+
- **Editor Enhancement**: [Overtype](https://overtype.dev/) with syntax highlighting
41+
- **Build**: Vite with React plugin
42+
3443
### Entry points
3544

3645
- `src/entrypoints/content.ts` - injected into every webpage
3746
- `src/entrypoints/background.ts` - service worker that manages state and handles messages
38-
- `src/entrypoints/popup` - html/css/ts which opens when the extension's button gets clicked
47+
- `src/entrypoints/popup` - React-based popup (html/css/tsx) with shadcn/ui table components
3948

4049
```mermaid
4150
graph TD
4251
Content[Content Script<br/>content.ts]
4352
Background[Background Script<br/>background.ts]
44-
Popup[Popup Script<br/>popup/main.ts]
53+
Popup[Popup Script<br/>popup/main.tsx]
4554
4655
Content -->|ENHANCED/DESTROYED<br/>CommentEvent| Background
4756
Popup -->|GET_OPEN_SPOTS<br/>SWITCH_TO_TAB| Background
@@ -62,11 +71,11 @@ graph TD
6271

6372
### Architecture
6473

65-
Every time a `textarea` shows up on a page, on initial load or later on, it gets passed to a list of `CommentEnhancer`s. Each one gets a turn to say "I can enhance this box!". They show that they can enhance it by returning a [`CommentSpot`, `Overtype`].
74+
Every time a `textarea` shows up on a page, on initial load or later on, it gets passed to a list of `CommentEnhancer`s. Each one gets a turn to say "I can enhance this box!". They show that they can enhance it by returning something non-null in the method `tryToEnhance(textarea: HTMLTextAreaElement): Spot | null`. Later on, that same `Spot` data will be used by the `tableRow(spot: Spot): ReactNode` method to create React components for rich formatting in the popup table.
6675

67-
Those values get bundled up with the `HTMLTextAreaElement` itself into an `EnhancedTextarea`, which gets added to the `TextareaRegistry`. At some interval, draft edits will get saved by the browser extension (TODO).
76+
Those `Spot` values get bundled up with the `HTMLTextAreaElement` itself into an `EnhancedTextarea`, which gets added to the `TextareaRegistry`. At some interval, draft edits get saved by the browser extension.
6877

69-
When the `textarea` gets removed from the page, the `TextareaRegistry` is notified so that the `CommentSpot` can be marked as abandoned or submitted as appropriate (TODO).
78+
When the `textarea` gets removed from the page, the `TextareaRegistry` is notified so that the `CommentSpot` can be marked as abandoned or submitted as appropriate.
7079

7180
## Testing
7281

0 commit comments

Comments
 (0)