mathieudutour / gatsby-digital-garden

🌷 🌻 🌺 Create a digital garden with Gatsby
https://mathieudutour.github.io/gatsby-digital-garden
MIT License
666 stars 102 forks source link

Include page mention excerpt from markdown files in ‘Referred in’ #18

Open keikhcheung opened 4 years ago

keikhcheung commented 4 years ago

Would it be possible to include excerpts from markdown files in the ‘Referred in’ section?

Currently, if the mention comes from notes originating from Roam, the parent block with the page mention is shown as a bullet point unter the page title. But for local markdown files, only the page title is given.

Screenshot 2020-06-19 at 17 50 49

If it is possible to extract and display the sentence or the paragraph where the parent page mention is, or even showing the first paragraph of this parent note as a preview, it would be make ‘Referred in’ more content-rich for markdown files, and also appear to be more consistent with Roam notes.

mathieudutour commented 4 years ago

Ah yeah I'm sure that's possible

Am3ra commented 4 years ago

@mathieudutour I would like to solve this, could you give me some pointers?

mathieudutour commented 4 years ago

So the goal is to add some content here: https://github.com/mathieudutour/gatsby-digital-garden/blob/master/packages/gatsby-theme-garden/src/utils/data-to-note.js#L51

To do so, we need to change the graphql query that get those. Because we support 3 difference types of sources (roam + local files, roam only, files only), there is a bit of a hack to make sure gatsby doesn't crash. So there is 3 different queries, we only need to change 2 of them:

Here we need to change inboundReferences to get the content we want in.

The main thing is to know what is the content we want.

If it's the excerpt of the content (the first few lines), it's pretty easy to get it (there is a field in the graphql schema for it). If it's the content around the reference, then it's a lot harder because we would need to get the entire content, somehow find the reference and then display it while removing all the markdown stuff.

I didn't get around fixing this issue because I wanted the 2nd one - but maybe we can start with the first one and think about the second later.

Let me know if that makes no sense

keikhcheung commented 3 years ago

@mathieudutour If we could extract from the beginning of the paragraph where the page is referenced, that would be really great.

Nonetheless, I am also trying to just get just the general excerpt of the source reference note from the graphql. But I cannot figure out why it is always returning undefined. I tried following your hints and what I did is:

  1. Adding excerpt after L37 in https://github.com/mathieudutour/gatsby-digital-garden/blob/master/packages/gatsby-theme-garden/fragments/file-and-roam.fragment#L37
  2. Similarly, adding excerpt after L21 in https://github.com/mathieudutour/gatsby-digital-garden/blob/master/packages/gatsby-theme-garden/fragments/file.fragment#L21
  3. Adding {node.excerpt} after L12 in https://github.com/mathieudutour/gatsby-digital-garden/blob/master/packages/gatsby-theme-garden/src/components/reference.js#L12
  4. Adding excerpt: ref.excerpt, after L53 in https://github.com/mathieudutour/gatsby-digital-garden/blob/master/packages/gatsby-theme-garden/src/utils/data-to-note.js#L53

And excerpt is undefined in the console.

Not very talented with Gatsby, I would appreciate any other tips that could shine some light. Thanks.