What does this PR do?

Fixed issue in DataTable when the rows are selectable and have a border the border doesn't show up on the CheckBox cell.

Where should the reviewer start?

What testing has been done on this PR?

Added a jest test and tested with the following story:

import React from 'react';

import { Box, DataTable } from 'grommet';

export const Test = () => (
  <Box align="center" pad="large">
    <DataTable
        data={[
          { name: "Alan", percent: 20 },
          { name: "Bryan", percent: 30 },
          { name: "Chris", percent: 20 },
          { name: "Eric", percent: 80 }
        ]}
        columns={[
          {
            property: "name",
            header: "Name",
            primary: true
          },
          {
            property: "percent",
            header: "Percent Complete"
          }
        ]}
        border={{ body: { side: "bottom" } }}
        onSelect={() => {}}
        groupBy={{ property: 'percent' }}
      />
  </Box>
);

export default {
  title: 'Visualizations/DataTable/Test',
};

How should this be manually tested?

Do Jest tests follow these best practices?

• screen is used for querying.
• The correct query is used. (Refer to this list of queries)
• userEvent is used in place of fireEvent.
• asFragment() is used for snapshot testing.

Any background context you want to provide?

What are the relevant issues?

Closes #6657

Screenshots (if appropriate)

Do the grommet docs need to be updated?

No

Should this PR be mentioned in the release notes?

Yes

Is this change backwards compatible or is it a breaking change?

Backwards compatible