feat: Scaffold basic Control window type with semi-transparent background

[yujonglee]

feat: add Control window type with semi-transparent background

Summary

Adds a new Control window type to the windows plugin with transparency support. The window is configured as a small (300x200), resizable, semi-transparent window that allows users to see the background through it.

Changes:

• Added Control variant to AppWindow enum in plugins/windows/src/window/v1.rs with transparent(true) enabled
• Created route component at apps/desktop/src/routes/app/control.tsx with bg-black/50 backdrop-blur-md styling
• Updated auto-generated TypeScript bindings and route tree

Updates since last revision

• Fixed pre-existing TypeScript error: removed unused cn import from apps/desktop/src/components/main/sidebar/search/index.tsx (was blocking CI)

Review & Testing Checklist for Human

• Test transparency on target platform(s) - Transparent windows behave differently on macOS/Windows/Linux. Run the app and open the Control window to verify the see-through effect works as expected
• Verify window size (300x200) - Confirm this is the desired size for the control window use case
• Check if additional Tauri config is needed - Some platforms may require additional configuration in tauri.conf.json for transparency to work properly

Recommended test plan:

1. Run ONBOARDING=0 pnpm -F desktop tauri dev
2. Open the Control window via devtools or by calling windowsCommands.windowShow({ type: "control" })
3. Verify the window appears semi-transparent with backdrop blur
4. Test dragging the window (header has data-tauri-drag-region)
5. Test on multiple platforms if possible

Notes

• The control.tsx component currently shows placeholder content - actual functionality will need to be added

Link to Devin run: https://app.devin.ai/sessions/ce11dbaf17094bab8b6700046276dafc
Requested by: yujonglee (@yujonglee)

[devin-ai-integration]

🤖 Devin AI Engineer

I'll be helping with this pull request! Here's what you should know:

✅ I will automatically:

• Address comments on this PR that start with 'DevinAI' or '@devin'.
• Look at CI failures and help fix them

Note: I can only respond to comments from users who have write access to this repository.

⚙️ Control Options:

• Disable automatic comment and CI monitoring

[netlify]

✅ Deploy Preview for hyprnote-storybook ready!

Name	Link
🔨 Latest commit	a12b61c
🔍 Latest deploy log	https://app.netlify.com/projects/hyprnote-storybook/deploys/6927b8ec63e1370008f0f9f3
😎 Deploy Preview	https://deploy-preview-1936--hyprnote-storybook.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify project configuration.

[netlify]

✅ Deploy Preview for hyprnote ready!

Name	Link
🔨 Latest commit	a12b61c
🔍 Latest deploy log	https://app.netlify.com/projects/hyprnote/deploys/6927b8ecc9756800084d2c16
😎 Deploy Preview	https://deploy-preview-1936--hyprnote.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify project configuration.

[coderabbitai]

📝 Walkthrough

Walkthrough

The changes add a new "/app/control" route to the desktop application and extend the window management system to support a Control window type with transparency, resizable constraints, and initial 300×200 pixel sizing.

Changes

Cohort / File(s)	Change Summary
Control Route UI apps/desktop/src/routes/app/control.tsx	New route file for "/app/control" that exports a Route definition rendering a full-screen control panel with draggable header, semi-transparent black backdrop, and placeholder content
Window Management System plugins/windows/src/window/v1.rs	Added Control variant to AppWindow enum (serde rename "control"); extended Display, FromStr, and title() implementations; updated build_window to create Control window with transparency, resizable behavior, 300×200 minimum size, and initial resize sequence

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~8 minutes

• Verify window properties (transparency, resizability, minimum size) align with design intentions
• Confirm the new route is properly registered and accessible within the routing structure
• Ensure the Control variant follows established patterns for other window types

Possibly related PRs

• Add seperate window for devtool #1727: Adds a similar Devtool window variant to the same window management surface, following the same pattern for enum extension and window configuration.

Pre-merge checks and finishing touches

❌ Failed checks (1 warning)

Check name	Status	Explanation	Resolution
Docstring Coverage	⚠️ Warning	Docstring coverage is 0.00% which is insufficient. The required threshold is 80.00%.	You can run @coderabbitai generate docstrings to improve docstring coverage.

✅ Passed checks (2 passed)

Check name	Status	Explanation
Description check	✅ Passed	The pull request description clearly relates to the changeset, detailing the addition of a Control window type with transparency support across multiple files.
Title check	✅ Passed	The title accurately describes the main changes: adding a new Control window type with semi-transparent background styling, as evidenced by the Control variant added to AppWindow enum and the UI component with backdrop.

✨ Finishing touches

• 📝 Generate docstrings

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Post copyable unit tests in a comment
• Commit unit tests in branch devin/1764210173-control-window

---

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

[coderabbitai]

Actionable comments posted: 0

🧹 Nitpick comments (1)

plugins/windows/src/window/v1.rs (1)

18-20: Control AppWindow wiring is consistent; consider DRYing repeated sizing pattern

The new AppWindow::Control variant is fully wired (serde rename, Display/FromStr, title, and build_window with /app/control), and the window builder config (transparent, resizable, 300×200 min/initial size) matches the intended behavior and existing patterns.

If more windows follow this “build → sleep → set desired size” pattern, it could be worth extracting a small helper to reduce repetition, but that can be deferred.

Also applies to: 31-31, 47-47, 87-97, 178-191

📜 Review details

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 21777ff and 0289915.

⛔ Files ignored due to path filters (2)

• apps/desktop/src/routeTree.gen.ts is excluded by !**/*.gen.ts
• plugins/windows/js/bindings.gen.ts is excluded by !**/*.gen.ts

📒 Files selected for processing (2)

• apps/desktop/src/routes/app/control.tsx (1 hunks)
• plugins/windows/src/window/v1.rs (5 hunks)

🧰 Additional context used

📓 Path-based instructions (1)

**/*.{ts,tsx}

📄 CodeRabbit inference engine (AGENTS.md)

**/*.{ts,tsx}: Avoid creating a bunch of types/interfaces if they are not shared. Especially for function props, just inline them instead.
Never do manual state management for form/mutation. Use useForm (from tanstack-form) and useQuery/useMutation (from tanstack-query) instead for 99% of cases. Avoid patterns like setError.
If there are many classNames with conditional logic, use cn (import from @hypr/utils). It is similar to clsx. Always pass an array and split by logical grouping.
Use motion/react instead of framer-motion.

Files:

• apps/desktop/src/routes/app/control.tsx

🧬 Code graph analysis (2)

apps/desktop/src/routes/app/control.tsx (1)

packages/utils/src/cn.ts (1)

• cn (20-22)

plugins/windows/src/window/v1.rs (1)

plugins/windows/src/events.rs (2)

• window (14-14)
• window (32-32)

⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (5)

• GitHub Check: Redirect rules - hyprnote
• GitHub Check: Header rules - hyprnote
• GitHub Check: Pages changed - hyprnote
• GitHub Check: fmt
• GitHub Check: ci (macos, depot-macos-14)

🔇 Additional comments (1)

apps/desktop/src/routes/app/control.tsx (1)

5-40: Control route and layout look consistent and correct

The /app/control file‑route wiring and the Component layout (semi‑transparent backdrop, header drag regions, and content area) are consistent with existing patterns and the window configuration, with no obvious correctness or UX issues.