fix(ui/dashboards): prevent default on anchor tag

[OfTheDelmer]

Describe your proposed changes here.
Fixes an issue where clicking on a dashboard name from the dashboards index caused an incorrect redirect due to default behavior on the anchor tag.

• Well-formatted commit messages
• Rebased/mergeable
• Tests pass

[chnn]

Sweet. I think there's other places we have this same problem (for example, opening the edit bucket overlay).

I think that everywhere we are using an anchor tag, we should be using the Link component from react-router instead.

[OfTheDelmer]

@chnn yeah I noticed the resource card from @influxdata/clockface differs in that it doesn't use an anchor tag. It looks like none of the components using ResourceList.EditableName specify an hrefValue so it could probably be removed. However, only 3 of 8 components currently have the e.preventDefault(). I'll go ahead and add it there. Maybe after we update to 0.0.17 we can swap these with the @influxdata/clockface implementation.

[chnn]

@OfTheDelmer awesome. I do think we're using the hrefValue in a few places:

influxdb/ui/src/buckets/components/BucketCard.tsx

Line 48 in efa9851

hrefValue={this.editBucketLink}

influxdb/ui/src/variables/components/VariableCard.tsx

Line 63 in efa9851

hrefValue={this.editVariablePath}

I tried real quick adding e.preventDefault to the EditableName component itself, but that didn't seem to work. We could also try replacing the a with a div or Link in that component so that we don't have to e.preventDefault() everywhere it's used.

Also found a duplicate EditableName component that can probably be deleted if the one place it is used is updated:

https://github.com/influxdata/influxdb/blob/master/ui/src/shared/components/EditableName.tsx

[OfTheDelmer]

@chnn didn't realize the ResourceList.Name also had this hrefValue implementation, but since none of the ResourceList.EditableName are currently using it I'll just swap it out with an div and see how that goes.

[OfTheDelmer]

I tried real quick adding e.preventDefault to the EditableName component itself, but that didn't seem to work.

@chnn I experienced something similar this morning when trying to test the initial prevent default fix, but now find that running yarn build instead of yarn start reveals this does seem to fix this issue.

[chnn]

Oo weird, I think @121watts was experiencing something similar yesterday.

Does the behavior exist when using the hrefValue with a Link? My hunch is that is the combination we should be using everywhere.