All files / src/libs/BlockRenderComponents/InnerComponents GeneralComponents.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
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
import { Component, setIcon } from 'obsidian';
import Lng from 'src/classes/Lng';
import { Resolve } from 'src/libs/DependencyInjection/functions/Resolve';
import EditableDataView from 'src/libs/EditableDataView/EditableDataView';
import { FileType } from 'src/libs/FileType/FileType';
import { FileTypes } from 'src/libs/FileType/interfaces/IFileType';
import { HelperGeneral } from 'src/libs/Helper/General';
import { IPrjSettings } from 'src/types/PrjSettings';
 
/**
 * General components class for `BlockRenderComponent`.
 */
export default class GeneralComponents {
    /**
     * Creates a link to the file at `path` with the `corospondingSymbol` as icon.
     * @param container The container to append the link to.
     * @param component The component to register the events to.
     * @param path The path to the file.
     * @param type The type of the file.
     * @param corospondingSymbol The corosponding symbol for the file type.
     */
    public static createMetadataLink(
        container: DocumentFragment,
        component: Component,
        path: string,
        type: FileType | FileTypes | undefined | null,
        corospondingSymbol: string,
    ): void {
        new EditableDataView(container, component).addLink((link) => {
            link.setValue(path)
                .setTitle(Lng.gt(type?.toString() ?? 'File'))
                .setLinkType('file')
                .setFormator((value: string) => {
                    const icon = document.createDocumentFragment();
                    const iconString = corospondingSymbol;
                    setIcon(icon as unknown as HTMLDivElement, iconString);
 
                    return { href: `${value}`, text: `${value}`, html: icon };
                });
        });
    }
 
    /**
     * Create a cell with a date.
     * @param date The container to append the date to.
     * @param component The component to register the events to.
     * @param title The title of the date.
     * @param format The format of the date.
     * @param onRead The function to read the date from model.
     * @param onWrite The function to write the date to model.
     */
    public static createCellDate(
        date: DocumentFragment,
        component: Component,
        title: string,
        format: string,
        onRead: () => string,
        onWrite: (value: string) => void,
    ): void {
        new EditableDataView(date, component).addDate((date) => {
            date.setValue(onRead())
                .setTitle(title)
                .enableEditability()
                .setFormator((value: string) =>
                    HelperGeneral.formatDate(value, format),
                )
                .onSave((value: string) => {
                    onWrite(value);
 
                    return Promise.resolve();
                });
        });
    }
 
    /**
     * Create a cell with tags as links.
     * @param tagContainer The container to append the tags to.
     * @param component The component to register the events to.
     * @param tags The tags to create links for.
     */
    public static createCellTags(
        tagContainer: DocumentFragment,
        component: Component,
        tags: string[],
    ): void {
        tags.forEach((tag) => {
            new EditableDataView(tagContainer, component).addLink((link) => {
                link.setValue(tag)
                    .setTitle('Tag')
                    .setLinkType('tag')
                    .setFormator((value: string) => {
                        const baseTag =
                            Resolve<IPrjSettings>('IPrjSettings').baseTag + '/';
                        let valueReduced = value;
 
                        Iif (
                            valueReduced &&
                            valueReduced !== '' &&
                            valueReduced.startsWith(baseTag)
                        ) {
                            valueReduced = valueReduced.substring(
                                baseTag.length,
                            );
                        }
 
                        return { href: `#${value}`, text: `#${valueReduced}` };
                    });
            });
        });
    }
}