Spread extra props into components for event tracking.

[ghost]

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

Rather than having custom logic in psammead for simorgh event tracking, can we instead spread props into this component, and set the data attribute in simorgh please? IMO we shouldnt have custom logic specific to simorgh when its not needed. Someone else using Brand may not do event tracking like we are. It also makes it very difficult for us to change our event tracking method in the future.

Describe the solution you'd like
Revert work done on

• Add data attribute to StoryPromo Component #2354
• Add data attribute to SectionLabel Component #2353
• Add data attribute to navigation links #2343

Psammead component:

export const IndexAlsos = props => (
    <div {...props}>
      {props.children}
    </div>
  );

Simorgh:

  return (
    <IndexAlsos data-e2e="index-alsos">{...}</IndexAlsos>

Describe alternatives you've considered

Testing notes
[Tester to complete]

Dev insight: Will there be any potential regression? etc

• This feature is expected to need manual testing.

Additional context
Add any other context or screenshots about the feature request here.

[jamesdonoh]

My concern about the above example was just that surely I can pass any props I like to IndexAlsos and they'll end up on the (here unstyled) div, e.g.

<IndexAlsos data-e2e="index-alsos" potato="yes">

I see styled components swallow these but are we sure we are only ever going to spread to them?