[patternflow-bot]

ops / https://claude.ai/code/session_01W2r5W5G8pHm7FHtzrQW3NZ

Pattern Lab 의 To hardware 가 이제 화면에 보이는 코드 레이어를 번역해요. 전엔 Layers 에서 고른 코드 레이어가 숨김이거나 0% 여도 번역 프롬프트에 그 레이어 코드만 들어서, 보드엔 미리보기와 커뮤니티에 올리는 것과 다른 패턴이 갔어요. 이제 To hardware 와 커뮤니티 올리기가 같은 함수로 레이어를 골라요.

좋아지는 것: 숨긴 레이어를 골라 둬도 보이는 패턴이 보드로 간다 — 미리보기와 다른 그림이 안 올라간다

• incoming/ROUND.md 와 앞 바퀴 PR 댓글 읽기 (세 직함이 쓰고 꼬리말 없는 글은 [DONE] hardware: Besoiobiy's printed case as a remix folder #1 의 「Moved upstream」 하나뿐이고 일이 아니에요. [DONE] 폰에서 Pattern Lab 아래 탭을 눌러도 다른 패널이 닫히지 않고, 「⌄」 메뉴가 패널 위에 열린다 #189~[DONE] To hardware 에 AI 답을 통째로 붙여도 헤더만 남고, 빈 칸에서 「Copy .h」 가 복사했다고 하지 않는다 #194 엔 리뷰도 줄 댓글도 없어요)
• 고를 줄 정하기: 후보 6 (15위는 바퀴 6670)
• 시험으로 재현 (HardwareModal.test.tsx 에 둘, 옛 코드에선 둘 다 빨강)
• 고치기
• lint · typecheck · build · check:ci · check:voice · check:human-lock
• 폰 390 · 데스크톱 1440 사진
• dev merge (dev 가 d3c3b13 그대로라 합칠 것이 없었어요)
• PR 검사 초록 (0793305 에서 Drift checks · Web CI 둘 다 success)

한 일

web/src/lib/lab/flatten.ts 에 loneCodeLayer 를 더했어요. 보이는 레이어(숨김이 아니고, 마스크거나 불투명도가 0 보다 큰 것)가 하나뿐이고 그게 마스크 아닌 코드 레이어면 그 레이어를, 아니면 null 을 돌려줘요. needsFlatten 은 이 함수가 null 인지만 봐요. 조건은 그대로예요.

web/src/app/pattern-lab/HardwareModal.tsx 는 레이어 하나 길의 프롬프트를 이 레이어로 지어요. 전엔 고른 레이어가 코드 레이어면 숨김이든 0% 든 그것을, 아니면 목록의 첫 코드 레이어를 썼어요. 보드로 보낼 때 빌드에 붙는 이름(label)도 이 레이어 이름이에요. 전엔 숨김이어도 목록 맨 위 코드 레이어의 이름이었어요. 레이어를 쌓은 길은 그대로예요.

web/src/app/pattern-lab/PatternLabClient.tsx 의 buildExportCode 는 같은 레이어를 state.layers.find(…) as CodeLayer 로 따로 찾고 있었어요. 이것도 loneCodeLayer 를 부르게 바꿔서, 두 길이 레이어를 고르는 곳이 한 곳이 됐어요.

증거

사진을 찍은 스크립트가 처음 연 Lab 에서 「+ Code」 를 누르고, 고른 채인 새 레이어 Code 2 의 눈을 끄고, To hardware 의 「Copy the conversion prompt」 를 눌러 클립보드를 읽었어요. 프롬프트 끝의 「JavaScript source」 엔 보이는 Code 1 의 코드가 들었고, Code 2 의 시작 코드(「New layer — draws scrolling bands」)는 없었어요.

390px: 2 layer rows, prompt 25600 bytes, hidden starter code in prompt: false
  source: // @matrix 128x64 | // ===== Patternflow pattern ===== | // Title:   260707
1440px: 2 layer rows, prompt 25600 bytes, hidden starter code in prompt: false
  source: // @matrix 128x64 | // ===== Patternflow pattern ===== | // Title:   260707

새 시험은 고른 레이어를 숨긴 것과 0% 로 둔 것 둘이에요. 프롬프트에 보이는 레이어 코드가 들고 숨긴 레이어 코드가 없는지, 보드로 보낼 때 빌드 요청의 이름이 보이는 레이어 이름인지 봐요. 고치기 전 코드에선 둘 다 빨갰어요. 프롬프트에 숨긴 레이어 코드만 들었어요.

   × HardwareModal > translates the layer that shows when the picked one is hidden 34ms
   × HardwareModal > translates the layer that shows when the picked one is at 0% 23ms
      Tests  2 failed | 16 passed (18)
$ (고친 뒤) npx vitest run src/app/pattern-lab/HardwareModal.test.tsx src/lib/lab src/components/guide/tutorials
 Test Files  12 passed (12)
      Tests  346 passed (346)

web/ 에서 다섯 검사의 끝줄이에요.

$ npm ci                           → exit 0
$ npm run lint -- --max-warnings=0 → lint exit 0
$ npm run typecheck                → typecheck exit 0
$ npm run build                    → build exit 0
$ npm run check:ci                 → Test Files  93 passed (93) · Tests  1156 passed (1156) · skipped links-absolute · skipped roadmap · check:ci exit 0
$ npm run check:voice              → check:voice: nothing found
$ npm run check:human-lock         → check:human-lock: no locked words changed

links-absolute 와 roadmap 은 gh 가 원래 레포를 못 읽는 컨테이너라 skipped 예요. PR 의 drift.yml 이 다시 돌려요.

실행법

web/ 에서 NEXT_PUBLIC_BUILD_ENABLED=1 npm run build && npx next start -p 3100 다음 /pattern-lab 을 열어요. Layers 에서 「+ Code」 를 누르고, 고른 채인 새 레이어의 눈을 꺼요. 머리의 To hardware 에서 「Copy the conversion prompt」 를 누르면 프롬프트 끝의 JavaScript 는 밑의 보이는 레이어 코드예요. 시험만은 npx vitest run src/app/pattern-lab/HardwareModal.test.tsx 예요.

가정

• 표 줄의 고칠 곳은 HardwareModal.tsx 와 그 시험이지만 flatten.ts 와 PatternLabClient.tsx 도 고쳤어요. 표 줄이 「같은 조건으로 고르고」 라고 해서, 조건을 두 곳에 따로 쓰지 않고 함수 하나로 모았어요. 커뮤니티 올리기가 고르는 레이어는 전과 같아요. needsFlatten 이 거짓일 때 보이는 코드 레이어는 하나뿐이라 find 가 찾던 것과 같은 레이어예요.
• 레이어 하나 길에서 고른 레이어를 먼저 보던 것을 뺐어요. 그 길에 들어오면 보이는 코드 레이어가 하나뿐이라 고를 것이 없고, 고른 레이어가 다를 땐 늘 안 보이는 레이어였어요.
• 보낼 때 이름의 마지막 대비 값 「Pattern」 은 뺐어요. 레이어 하나 길이면 loneCodeLayer 가 늘 레이어를 돌려줘서 닿지 않는 값이었어요. 쌓은 길은 전처럼 패턴 이름이에요.
• components/guide/tutorials/lab.ts:118 의 stackOf 는 needsFlatten 을 베낀 것이고 조건이 그대로라 고치지 않았어요. lab.test.ts 가 둘이 같은지 봐요.
• 사진은 NEXT_PUBLIC_BUILD_ENABLED=1 로 다시 빌드해 찍었어요. 그 값이 없으면 To hardware 단추가 머리에 없어요. Code 패널의 편집기가 「Loading...」 인 것은 이 컨테이너가 jsdelivr 를 막아서예요.
• 고친 뒤엔 화면 글이 바뀌지 않아서 사진은 같은 창이에요. 무엇이 달라졌는지는 위 클립보드 출력이 보여요.

Changelog

Web

• Pattern Lab's To hardware translates the layer that shows. With one code layer showing and a hidden or 0% code layer picked in Layers, the conversion prompt carried the hidden layer's code, so the board got a pattern the preview and the community upload did not show. To hardware and the upload now pick the layer the same way.

경험

언제: 바퀴에서 Pattern Lab 을 폰 390 으로 몰며 Layers 패널의 단추를 누를 때
교훈: 「+ Code」 를 누르면 Code 탭이 앞으로 와서 Layers 가 뒤로 숨으니, 레이어를 더한 뒤 .dv-tab 의 Layers 를 한 번 더 누르고 나서 레이어 줄의 「Hide layer」 를 찾는다
근거: #196 에서 390 폭만 button[aria-label="Hide layer"] 를 30초 기다리다 끝났고, 더한 뒤 Layers 탭을 다시 누르니 두 폭 다 지나갔어요

바퀴

바퀴 71 · 후보 6 「To hardware 가 숨긴 레이어 대신 보이는 레이어를 번역하게 한다」

다음 바퀴

• 7 「Lab 이 만든 C++ 헤더가 노브 값과 이름 때문에 컴파일에 막히지 않는다」 · 반올림해서야 정수가 되는 노브 값이 63f 처럼 .0 없이 나와 g++ 가 멈춰요.
• 8 「레이어 하나를 반투명이나 곱하기로 두어도 올린 패턴이 미리보기와 같은 밝기다」 · 불투명도 0.5 인 흰 레이어가 미리보기는 128 인데 올린 패턴은 255 예요. 이번 바퀴로 To hardware 와 올리기가 loneCodeLayer 하나를 보니, 거기서 고치면 두 길이 같이 맞아요.
• 9 「const draw = … 로 쓴 코드 레이어를 다른 레이어와 쌓아 올려도 그 패턴이 돈다」 · 쌓아 내보낸 코드가 「Identifier 'draw' has already been declared」 로 불러오기부터 실패해요.

https://claude.ai/code/session_01W2r5W5G8pHm7FHtzrQW3NZ

---

Generated by Claude Code