React Hooks "I am trying to use react hooks with checkbox toggle but its updating all checkbooxes " using rendition

I am trying to manage state with react hooks for my checkBOx toggle but I am failing to manage different state for different checkbox, with my code I am trying "ON" & "OFF" for toggle but when I am trying to toggle any checkbox its changing states for all of my checkboxes all at once. following is my code :

import React,{useState} from 'react';
import { Box, Checkbox, Flex, Table, Txt } from 'rendition';
import styled from 'styled-components';

const ControlContainer = styled(Box)`
  border-top-left-radius: 10px;
`;

export const Devices = () => {
const [checked, setChecked] = useState(true);


function toggle(event) {
 return setChecked(event.target.checked ? setChecked(false) : setChecked(true));
}

const SAMPLE_DATA = [
  {
    id: 1,
    name: 'Balcony',
    active: true,
    brightness: 50,
  },
  {
    id: 2,
    name: 'Bedroom 01',
    active: false,
    brightness: 70,
  },
  {
    id: 3,
    name: 'Bedroom 02',
    active: false,
    brightness: 70,
  },
];

const columns = [

  {
    field: 'name',
    label: 'Room',
    sortable: true,
  },
  {
    field: 'active',
    label: 'State',
    sortable: true,
    render() {
      return (
        <Flex>
          <Checkbox toggle checked={checked} onChange={toggle} mr={2} />
          <Txt ml={2}>{checked ? 'On' : 'Off'}</Txt>
        </Flex>
      );
    },
  },
  {
    field: 'brightness',
    label: 'Brightness',
    sortable: true,
    render(value) {
      return `${value}%`;
    },
  },
];
  return (
    <Flex flex='1' mt={4}>
      <Box flex='3' pl={3}>
        <Table
          flex='1'
          columns={columns}
          data={SAMPLE_DATA}
          rowKey='id'
          onRowClick={console.log}
        />
      </Box>
    </Flex>
  );
};