work-view

import type { Register } from 'claude-code'

// Drawn like work-view by <AUTHOR> (pane), as modscode read it from the mod's code:
// https://modscode.com/gallery/marcustung-work-view/
// Written by modscode from that reading, not copied from the mod: use it as you like.
// Each value below stands for one the mod works out at run time; put in your own.
export const register: Register = on => {
  // the pane: open it with $.ui.open({ id: 'my-pane', title: "今天的工作看板" })
  on('ui.render', { component: 'Pane', requestId: 'my-pane' }, async ($, e) => {
    const { Box, Text } = $.ui.resolve(e)
    const length = '…'
    const items = '…'
    const items2 = '…'
    const items3 = '…'
    const length2 = '…'
    const title = '…'
    const waiting = '…'
    const title2 = '…'
    const waiting2 = '…'
    const title3 = '…'
    const waiting3 = '…'
    const source = '…'
    const length3 = '…'
    return (
      <Box flexDirection="column">
        <Text bold>
          {"hook 擋過 "}
          {length}
          {" 次"}
          ，已退回重排
        </Text>
        <Text color="red">
          {" 退回："}
          {items}
        </Text>
        <Text color="red">
          {" 退回："}
          {items2}
        </Text>
        <Text color="red">
          {" 退回："}
          {items3}
        </Text>
        <Box marginTop={1}>
          <Text bold>
            今天的工作（
            {length2}
            {" 件）"}
          </Text>
        </Box>
        <Box flexDirection="column" marginTop={1}>
          <Text bold color="red">
            {title}
            （曾被 hook 退回）
          </Text>
          <Text dimColor>
            {" ① 發送端："}
            —
          </Text>
          <Text dimColor>
            {" ② 接收端："}
            —
          </Text>
          <Text dimColor>
            {" ③ 自動檢查："}
            —
          </Text>
          <Text color="green">
            {" ④ 交給："}
            （未填）
            {" 今天做："}
            是
          </Text>
          <Text dimColor>
            {" 在等："}
            {waiting}
          </Text>
        </Box>
        <Box flexDirection="column" marginTop={1}>
          <Text bold color="red">
            {title2}
            （曾被 hook 退回）
          </Text>
          <Text dimColor>
            {" ① 發送端："}
            —
          </Text>
          <Text dimColor>
            {" ② 接收端："}
            —
          </Text>
          <Text dimColor>
            {" ③ 自動檢查："}
            —
          </Text>
          <Text color="green">
            {" ④ 交給："}
            （未填）
            {" 今天做："}
            是
          </Text>
          <Text dimColor>
            {" 在等："}
            {waiting2}
          </Text>
        </Box>
        <Box flexDirection="column" marginTop={1}>
          <Text bold color="red">
            {title3}
            （曾被 hook 退回）
          </Text>
          <Text dimColor>
            {" ① 發送端："}
            —
          </Text>
          <Text dimColor>
            {" ② 接收端："}
            —
          </Text>
          <Text dimColor>
            {" ③ 自動檢查："}
            —
          </Text>
          <Text color="green">
            {" ④ 交給："}
            （未填）
            {" 今天做："}
            是
          </Text>
          <Text dimColor>
            {" 在等："}
            {waiting3}
          </Text>
        </Box>
        <Box marginTop={1}>
          <Text dimColor>
            資料來源：
            {source}
            （
            {length3}
            {" 筆查核結果）"}
          </Text>
        </Box>
      </Box>
    )
  })
}