Custom cell click event

[Lucifer-Clegg]

Hi, I just want to set the Custom cell click event in the "advanced" dataviewjs block like it does in the basic behavior. But in the docs there is only one example that opens the global search.

How do I set this to work like in basic (modal) code? (attachment)

[ggm1207]

It's a function I'm looking for, so I wrote it while looking through the source code. It's not a perfect answer, but I hope it helped.

const data = dv.pages('#note/calendar/daily')
    .groupBy(p => p.file.ctime.toFormat('yyyy-MM-dd'))
    .map(entry =>{
        const items = entry.rows
            .map((item) => {
                const label = item.file.path;
                const value = 0;
                const source = {
                    "type": "temp"
                }

                return {
                    label: label,
                    value: value,
                    link: {
                        href: item.file.path,
                        className: "internal-link",
                        rel: 'noopener'
                    },
                    open: (e) => app.workspace.openLinkText(
                        item.file.path, item.file.path
                    ),
                };
            })
            .array();

        return {
            date: entry.key,
            value: entry.rows.length,
            items: items
        }
    })

const calendarData = {
    days: 364,
    title: "Tracking Results",
    titleStyle: {
        textAlign: 'center',
        fontSize: '17px',
    },
    cellStyleRules: [
        {
            color: "#f1d0b4",
            min: 1,
            max: 999,
        },
    ],
    data: data,
    mainContainerStyle: {
        backgroundColor: "#ffffff"
    },
}

I'm also waiting for this answer!

[Lucifer-Clegg]

Thank you very much ggm1207,

very fine! What do I have to change, so that the search does'nt open? the click at the link opens the file, thats completely sufficient for me.

[ggm1207]

Erase the onCellClick in const calendar Data like below:

const calendarData = {
    days: 365,
    title: 'Contributions in the last 365 days ',
    data: data,
//    onCellClick: (item) => {
//      const key = `["tags":project] ["createTime":${item.date}]`
//      app.internalPlugins.plugins['global-search'].instance.openGlobalSearch(key)
//    },
    cellStyleRules: [
        {
            min: 1,
            max: 2,
            text: '🌲'
        },
        {
            min: 2,
            max: 3,
            text: '😥'
        },
        {
            min: 3,
            max: 4,
            text: '✈'
        },
        {
            min: 4,
            max: 99,
            text: '✈'
        }
    ]
}

[Lucifer-Clegg]

Ah, fine, thank you for your patience!

the dot on the i and the day would be perfect, if you also could tell me, how I do this click event in my other issue (https://github.com/vran-dev/obsidian-contribution-graph/issues/93) were the appropriate field is a list (array)

The Code I use:

const data = dv
    .pages("")
    .filter((p) => p.modified)
    // core, we should flatmap modified values, because  modified property is list
    .flatMap((p) => {
        if (!Array.isArray(p.modified)) {
            return [{
                time: p.modified,
                page: p
            }]
        }
        return p.modified.map((t) => {
            return {
                time: t,
                page: p,
            };
        });
    })
    .groupBy((p) => p.time.toFormat("yyyy-MM-dd"))
    .map((entry) => {
        return {
            date: entry.key,
            value: entry.rows.length,
        };
    });

const calendarData = {
    data: data,
    days: 365,
};

renderContributionGraph(this.container, calendarData);