{"version":3,"file":"components/Alerts/overlay.mjs","sources":["../../../src/components/Alerts/overlay.tsx"],"sourcesContent":["import React, { useState } from 'react';\nimport { SDK } from '@rsdoctor/types';\nimport {\n  Alert,\n  Button,\n  Col,\n  Collapse,\n  Row,\n  Tag,\n  Typography,\n  Badge,\n} from 'antd';\nimport {\n  BugOutlined,\n  CloseCircleOutlined,\n  DownOutlined,\n  RightOutlined,\n} from '@ant-design/icons';\nimport Dialog from 'rc-dialog';\nimport Ansi from 'ansi-to-react';\n\nimport { withServerAPI } from '../Manifest';\nimport { Size, Color } from '../../constants';\n\nimport styles from './overlay.module.scss';\n\nimport 'rc-dialog/assets/index.css';\n\nfunction getOverlayAlertsMessage(\n  alerts: SDK.ServerAPI.InferResponseType<SDK.ServerAPI.API.GetOverlayAlerts>,\n) {\n  let warns = 0;\n  let errors = 0;\n\n  alerts.forEach((item) => {\n    if (item.level === 'warn') {\n      warns++;\n    } else {\n      errors++;\n    }\n  });\n\n  const suffixText =\n    warns !== 0 && errors !== 0 ? 'problems' : warns === 0 ? 'errors' : 'warns';\n\n  const fontSize = 16;\n\n  return {\n    title: `${alerts.length} compiled ${suffixText}`,\n    detail: (\n      <Typography.Text strong style={{ color: '#fff', marginBottom: 0 }}>\n        <Typography.Text style={{ color: 'inherit', fontSize }}>\n          Compiled with\n        </Typography.Text>\n        <Typography.Text strong style={{ color: Color.Red, fontSize }}>\n          {' '}\n          {errors} {errors === 1 ? 'error' : 'errors'}{' '}\n        </Typography.Text>\n        <Typography.Text style={{ color: 'inherit', fontSize }}>\n          and\n        </Typography.Text>\n        <Typography.Text strong style={{ color: Color.Yellow, fontSize }}>\n          {' '}\n          {warns} {warns === 1 ? 'warning' : 'warnings'}\n        </Typography.Text>\n      </Typography.Text>\n    ),\n    warns,\n    errors,\n  };\n}\n\nexport const OverlayAlertsModal: React.FC<{\n  alerts: SDK.ServerAPI.InferResponseType<SDK.ServerAPI.API.GetOverlayAlerts>;\n  open: boolean;\n  onClose(): void;\n}> = ({ alerts = [], open, onClose }) => {\n  if (!alerts.length) return null;\n\n  return (\n    <Dialog\n      visible={open}\n      onClose={() => onClose()}\n      style={{ width: '100%', height: '100%', margin: 0, zIndex: 1000 }}\n      closable={false}\n      modalRender={(e) => {\n        return React.cloneElement(\n          e as React.ReactElement<{ style?: React.CSSProperties }>,\n          {\n            style: {\n              background: 'rgba(0, 0, 0, 0.7)',\n              color: '#fff',\n              height: '100%',\n              overflow: 'scroll',\n              borderRadius: 0,\n            },\n          },\n        );\n      }}\n    >\n      <Row justify=\"space-between\" align=\"middle\">\n        {getOverlayAlertsMessage(alerts).detail}\n        <Button\n          onClick={() => onClose()}\n          type=\"text\"\n          style={{ color: '#fff' }}\n          size=\"large\"\n          icon={<CloseCircleOutlined />}\n        ></Button>\n      </Row>\n      <Row gutter={[0, Size.BasePadding]}>\n        {alerts.map((e) => {\n          return (\n            <Col\n              span={24}\n              key={e.id}\n              style={{\n                whiteSpace: 'pre-wrap',\n                lineHeight: `16px`,\n                fontSize: 14,\n              }}\n            >\n              <Collapse\n                ghost\n                style={{ background: '#000' }}\n                defaultActiveKey={[e.id]}\n                expandIcon={(e) => {\n                  return e.isActive ? (\n                    <DownOutlined style={{ color: '#fff' }} />\n                  ) : (\n                    <RightOutlined style={{ color: '#fff' }} />\n                  );\n                }}\n              >\n                <Collapse.Panel\n                  header={\n                    <div style={{ color: '#fff' }}>\n                      {e.level === 'warn' ? (\n                        <Tag color={Color.Yellow}>WARNING</Tag>\n                      ) : (\n                        <Tag color={Color.Red}>ERROR</Tag>\n                      )}\n                      <Ansi>{e.description || e.title}</Ansi>\n                    </div>\n                  }\n                  key={e.id}\n                >\n                  <div style={{ color: '#fff' }}>\n                    <Ansi>{e.stack}</Ansi>\n                  </div>\n                </Collapse.Panel>\n              </Collapse>\n            </Col>\n          );\n        })}\n      </Row>\n    </Dialog>\n  );\n};\n\nexport const OverlayAlertsTips: React.FC<{\n  alerts: SDK.ServerAPI.InferResponseType<SDK.ServerAPI.API.GetOverlayAlerts>;\n  defaultOpen?: boolean;\n}> = ({ alerts = [], defaultOpen = alerts.length > 0 }) => {\n  if (!alerts.length) return null;\n\n  const [open, setOpen] = useState(defaultOpen);\n\n  return (\n    <React.Fragment>\n      <Alert\n        banner\n        message={React.cloneElement(\n          getOverlayAlertsMessage(alerts).detail as React.ReactElement<{\n            style?: React.CSSProperties;\n          }>,\n          {\n            style: {\n              color: '#000',\n            },\n          },\n        )}\n        icon={<BugOutlined />}\n        action={\n          <Button onClick={() => setOpen(true)} size=\"small\">\n            More\n          </Button>\n        }\n      ></Alert>\n      <OverlayAlertsModal\n        alerts={alerts}\n        open={open}\n        onClose={() => setOpen(false)}\n      />\n    </React.Fragment>\n  );\n};\n\nexport const OverlayAlertsButton: React.FC<{\n  alerts: SDK.ServerAPI.InferResponseType<SDK.ServerAPI.API.GetOverlayAlerts>;\n}> = ({ alerts = [] }) => {\n  if (!alerts.length) return null;\n\n  const [open, setOpen] = useState(false);\n\n  return (\n    <div className={styles.container}>\n      <div onClick={() => setOpen(!open)} className={styles.badgeContainer}>\n        <Badge count={alerts.length} size=\"small\">\n          <BugOutlined style={{ fontSize: 15 }} />\n        </Badge>\n      </div>\n      <OverlayAlertsModal\n        alerts={alerts}\n        open={open}\n        onClose={() => setOpen(false)}\n      />\n    </div>\n  );\n};\n\nexport const OverlayAlertsWithButton = withServerAPI({\n  api: SDK.ServerAPI.API.GetOverlayAlerts,\n  Component: OverlayAlertsButton,\n  responsePropName: 'alerts',\n  fallbackComponent: () => null,\n});\n\nexport const OverlayAlertsWithTips = withServerAPI({\n  api: SDK.ServerAPI.API.GetOverlayAlerts,\n  Component: OverlayAlertsTips,\n  responsePropName: 'alerts',\n  fallbackComponent: () => null,\n});\n"],"names":["getOverlayAlertsMessage","alerts","warns","errors","item","suffixText","fontSize","Typography","Color","OverlayAlertsModal","open","onClose","Dialog","e","React","Row","Button","CloseCircleOutlined","Size","Col","Collapse","DownOutlined","RightOutlined","Tag","Ansi","OverlayAlertsTips","defaultOpen","setOpen","useState","Alert","BugOutlined","OverlayAlertsButton","styles","Badge","OverlayAlertsWithButton","withServerAPI","SDK","OverlayAlertsWithTips"],"mappings":"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"}