frontend-vanilla/src/store.ts


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73

import type { Feed, Item, Category } from './types.ts';

export type StoreEvent = 'feeds-updated' | 'tags-updated' | 'items-updated' | 'active-feed-updated' | 'active-tag-updated' | 'loading-state-changed' | 'filter-updated';

export type FilterType = 'unread' | 'all' | 'starred';

export class Store extends EventTarget {
    feeds: Feed[] = [];
    tags: Category[] = [];
    items: Item[] = [];
    activeFeedId: number | null = null;
    activeTagName: string | null = null;
    filter: FilterType = 'unread';
    loading: boolean = false;
    hasMore: boolean = true;

    setFeeds(feeds: Feed[]) {
        this.feeds = feeds;
        this.emit('feeds-updated');
    }

    setTags(tags: Category[]) {
        this.tags = tags;
        this.emit('tags-updated');
    }

    setItems(items: Item[], append: boolean = false) {
        if (append) {
            this.items = [...this.items, ...items];
        } else {
            this.items = items;
        }
        this.emit('items-updated');
    }

    setActiveFeed(id: number | null) {
        this.activeFeedId = id;
        this.activeTagName = null;
        this.emit('active-feed-updated');
    }

    setActiveTag(name: string | null) {
        this.activeTagName = name;
        this.activeFeedId = null;
        this.emit('active-tag-updated');
    }

    setFilter(filter: FilterType) {
        if (this.filter !== filter) {
            this.filter = filter;
            this.emit('filter-updated');
        }
    }

    setLoading(loading: boolean) {
        this.loading = loading;
        this.emit('loading-state-changed');
    }

    setHasMore(hasMore: boolean) {
        this.hasMore = hasMore;
    }

    private emit(type: StoreEvent, detail?: any) {
        this.dispatchEvent(new CustomEvent(type, { detail }));
    }

    on(type: StoreEvent, callback: (e: CustomEvent) => void) {
        this.addEventListener(type, callback as EventListener);
    }
}

export const store = new Store();