Uploaded image for project: 'Data Management'
  1. Data Management
  2. DM-18343

Enable Markdown content in Chronograf table cells

    XMLWordPrintable

    Details

    • Type: Story
    • Status: Done
    • Resolution: Done
    • Fix Version/s: None
    • Component/s: squash
    • Labels:
      None

      Description

      SQuaSH store code changes for each CI run with respect to the previous one. This information must be added to InfluxDB and displayed by Chronograf.

      To display that in Chronograf, we need the ability to add links to external pages into the Chronograf table cells.

        Attachments

          Issue Links

          relates to

          Improvement - An improvement or enhancement to an existing feature or task. DM-18583 Chronograf UI improvement: Fix table cell width with URL content

          • To Do

          Story - Created by Jira Software - do not edit or delete. Issue type for a user story. DM-18103 Revisit SQuaSH InfluxDB data model

          • Done

            Activity

            Ascending order - Click to sort in descending order
            Hide
            Permalink
            afausti Angelo Fausti added a comment - - edited

            By default, ReactJS escapes the HTML to prevent XSS (Cross-site scripting).

            I've tried to use the dangerouslySetInnerHTML property in the table cells like this:

            <div> dangerouslySetInnerHTML={{__html: cellContents}} </div>

            But looking at how Chronograf implements the Markdown cells in the Dashboard, the markdown-react library is a better option, it can safely insert HTML into the DOM.

            Show
            afausti Angelo Fausti added a comment - - edited By default, ReactJS escapes the HTML to prevent XSS (Cross-site scripting). I've tried to use the dangerouslySetInnerHTML property in the table cells like this: <div> dangerouslySetInnerHTML={{__html: cellContents}} </div> But looking at how Chronograf implements the Markdown cells in the Dashboard, the markdown-react library is a better option, it can safely insert HTML into the DOM.
            Hide
            Permalink
            afausti Angelo Fausti added a comment -

            See PR: https://github.com/lsst-sqre/chronograf/pull/3

            Show
            afausti Angelo Fausti added a comment - See PR: https://github.com/lsst-sqre/chronograf/pull/3

              People

              Assignee:
              afausti Angelo Fausti
              Reporter:
              afausti Angelo Fausti
              Watchers:
              Angelo Fausti
              Votes:
              0 Vote for this issue
              Watchers:
              1 Start watching this issue

                Dates

                Created:
                Updated:
                Resolved:

                  Jenkins

                  No builds found.