export default function DemoDefault()

in packages/cookie/stories/demo-default/index.tsx [58:104]


export default function DemoDefault(): JSX.Element {
  const [stateCookies, setStateCookies] = useState(ALL_COOKIES);
  const [stateOneCookie, setStateOneCookie] = useState(ONE_COOKIE);
  
  const handleRefreshAll = useCallback(() => setStateCookies(getAllCookies()), [setStateCookies]);
  const handleRefreshOne = useCallback(() => setStateOneCookie(getCookie(TEST_COOKIE)), [setStateOneCookie]);
  
  const handleSetCookie = useCallback(() => {
    setCookie(TEST_COOKIE, new Date().toISOString());
    handleRefreshAll();
    handleRefreshOne();
  }, [handleRefreshAll, handleRefreshOne]);
  const handleDeleteCookie = useCallback(() => {
    deleteCookie(TEST_COOKIE);
    handleRefreshAll();
    handleRefreshOne();
  }, [handleRefreshAll, handleRefreshOne]);
  
  return <>
    <H1>全部 Cookie</H1>
    <Button onClick={handleDeleteCookie}>{`deleteCookie('${TEST_COOKIE}')`}</Button>
    <Button onClick={handleSetCookie}>{`setCookie('${TEST_COOKIE}') → getCookie('${TEST_COOKIE}') → ${stateOneCookie}`}</Button>
    <PreJson o={stateCookies} />
    <Table<ITestItem> {...{
      dataSource: TEST_ITEMS,
      columns: [{
        title: 'Cookie',
        dataIndex: 'name'
      }, {
        title: 'SameSite',
        dataIndex: 'sameSite'
      }, {
        title: 'Secure',
        dataIndex: 'secure'
      }, {
        title: '设置值',
        dataIndex: 'value'
      }, {
        title: '获取值',
        dataIndex: 'valueGet'
      }, {
        title: '结果',
        renderCell: o => (o.value === o.valueGet ? <span>✅</span> : <span>❌</span>)
      }]
    }} />
  </>;
}