gitgraph.js icon indicating copy to clipboard operation
gitgraph.js copied to clipboard

Can I set commit attributes when using GitgraphUserApi.import()?

Open h-otter opened this issue 4 years ago • 1 comments

Is your feature request related to a problem? Please describe.

GitgraphUserApi.import() is very useful when drawing complex git graphs. However, I recognize that there is no way to manipulate commit attributes such as style and onClick. Especially typescript is restricted by type, so I cannot access commit attributes. I want to change the style for some commits or set an onClick handler for all commits.

Describe the solution you'd like

I propose passing a function to GitgraphUserApi.import() to translate CommitOptions.

Describe alternatives you've considered

I propose to change https://github.com/nicoespeon/gitgraph.js/blob/a4a26a280bdb4027e9747e05148c9c7a3baf19bc/packages/gitgraph-core/src/user-api/gitgraph-user-api.ts#L188 to

  public import(data: unknown, translator?: (CommitOptions<TNode>) => CommitOptions<TNode>) {

and https://github.com/nicoespeon/gitgraph.js/blob/a4a26a280bdb4027e9747e05148c9c7a3baf19bc/packages/gitgraph-core/src/user-api/gitgraph-user-api.ts#L225-L228 to

      }))
      .map(translator)
      // Git2json outputs is reverse-chronological.
      // We need to commit it chronological order.
      .reverse();

In this case, I think it can be used as follows.

gitgraph.import(data, (commit)  => {
  commit.onClick = () => { alert("clicked") };
  
  if (commit.subject.indexOf("bug") != -1) {
    commit.dotText = "🐛";
  }

  return commit;
}

Additional context

I am a beginner in typescript. I'm sorry if gitgraphjs already has another solution.

h-otter avatar Nov 23 '19 19:11 h-otter

i thinks this is a good idea !

applelizihao avatar Aug 28 '20 10:08 applelizihao