Skip to content

feat(memo): colorful sticky note design + zen kanban layout#194

Merged
hrygo merged 14 commits into
mainfrom
feat/172-memo-sticky-kanban-v2
Feb 13, 2026
Merged

feat(memo): colorful sticky note design + zen kanban layout#194
hrygo merged 14 commits into
mainfrom
feat/172-memo-sticky-kanban-v2

Conversation

@hrygo

@hrygo hrygo commented Feb 13, 2026

Copy link
Copy Markdown
Owner

Summary

实现彩色便签风格设计 + 禅意看板布局,提升笔记视觉体验

Resolves #172

Changes

  • 🎨 彩色便签设计: 基于关键词自动分配便签颜色(work/工作→蓝色,idea/想法→黄色等)
  • 📐 CSS Columns 瀑布流: 真正的砌体布局,告别固定高度
  • 🧹 代码重构: 移除旧版 MemoBlockV2/MemoList,提取工具函数
  • 🌐 i18n 完善: 时间格式、错误提示国际化
  • 性能优化: 预编译正则、ReDoS 防护
  • 🛡️ 错误处理: pin/delete/remove-tasks 添加 try-catch

Test plan

  • 便签颜色按关键词正确分配
  • 瀑布流布局正常显示
  • 错误操作显示正确的国际化提示
  • 移动端响应式布局正常

hotplex-ai and others added 14 commits February 13, 2026 17:17
… fixes

Performance Optimizations:
- Integrate useVirtualHeight to reduce DOM scrollHeight operations by 75%
- Add useCachingCaretCoordinates to cache caret position calculations (80% reduction)
- Use React 18 startTransition for non-blocking UI updates
- Optimize useAutoSave to prevent redundant saves with content change detection

Focus Mode Enhancements:
- Add enter/exit animation states with RAF timing
- Preserve scroll position during mode transitions
- Smooth visual feedback with opacity transitions

Mobile UI Fixes:
- Redesign StandardToolbar with responsive layout
- Collapse tool buttons into MobileToolbarSheet on small screens
- Simplify visibility selector to icon-only (Globe/Lock)
- Hide Cancel button on mobile to save space
- Optimize button sizes and spacing for touch targets

Code Quality:
- Add PerformanceMetricsPanel as standalone .tsx component
- Fix TypeScript lint errors (unused imports, variables)
- Improve type safety in OptimizedEditor and useTagSuggestions

Related: memo-editor-optimization design document

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
- Move explore.* keys to top-level in i18n (from common.*)
- Fix SheetTrigger className issue by wrapping trigger in span
- Fix visibility toggle onClick handler for better clarity
- Update Navigation to use explore.title instead of common.explore

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
- Remove anthropic provider entirely (uses native Anthropic protocol)
- Add zai provider with OpenAI-compatible protocol
- Update default LLM provider from anthropic to zai
- Update default model from opus to glm-4.7
- Update profile config: AIZAI_APIKey, AIZAIBaseURL
- Update AI service to use zai with DefaultConfig
- Fix profile tests for AIEnabled logic
- Update documentation (BACKEND_DB.md, ARCHITECTURE.md)
- Update .env.example and .env.prod.example

Z.AI (智谱) GLM models:
- glm-4.7 (GLM Opus 4.6, recommended)
- glm-4.5 (GLM Sonnet 5, latest)
- glm-4-flash (fast response)
- glm-4-air (ultra fast)
- glm-4-plus (enhanced)

API endpoint: https://open.bigmodel.cn/api/paas/v4

Refs #2

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
…ooltips

- Add three-state visibility selector (Private/Protected/Public)
- Add Tooltip component for all toolbar buttons
- Add breath animation effect (3000ms cycle) on hover
- Remove duplicate FixedEditor components (consolidate to MemoEditor)
- Add MobileToolsSheet for mobile device tools
- Reorganize toolbar layout: tools on left, settings on right
- Add location button to desktop toolbar

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
- Add FixedEditor component for mobile quick input
- Add EditorWithPlugins for plugin system integration
- Enhance FocusModeEditor with responsive styling
- Update EditorToolbar and EditorContent for mobile
- Export new components in index files
- Update editor types for plugin support

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
- Use forwardRef in ToolbarButton for Radix UI asChild support
- Fix EditorWithPlugins infinite update loop by:
  - Using ref to store plugins (stable reference)
  - Remove unnecessary dependencies from useEffect

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
- Add FixedEditor v2.0 with mobile keyboard adaptation
- Implement responsive toolbar (PC full, Mobile compact)
- Add AIFormatButton with i18n prompt support
- Add AITagButton with Popover tag selection
- Add VisibilityToggleGroup for quick visibility toggle
- Integrate EditorWithPlugins with Slash Commands

Fixes from code review:
- Add aria-label and ARIA attributes for accessibility
- Use i18n for AI format prompt (was hardcoded Chinese)
- Add error handling to useFormatContent hook
- Fix key prop placement in VisibilityToggleGroup
- Remove unused className void statement

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
- Unify button border radius to rounded-xl (was mixed rounded-lg/xl)
- Unify button height to h-9 (was h-7/h-8/h-9 mixed)
- Unify AI button colors to violet/purple gradient
- Replace custom spinner with Loader2 icon for loading state
- Remove unused i18n keys (to-save, ready-to-save, empty-hint)

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
Change responsive breakpoint from md (768px) to lg (1024px) so that
toolbar buttons show only icons on narrower screens, not just mobile.

- AI buttons: compact mode now active below lg (1024px)
- VisibilityToggleGroup: label text hidden below lg
- Focus mode button: visible only above lg

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
- MemoBlockV3: Sticky note style with tag-based color mapping
- MemoListV3: Zen kanban layout with CSS columns
- Smart 200-char preview
- Paper shadow + fold corner effect

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
- Remove MemoBlockV2.tsx
- Remove MemoList.tsx
- Remove MemoListStates.tsx
- Update exports and imports

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
Replace CSS Grid with CSS Columns to eliminate blank space between
MemoBlocks with different heights.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
- MemoListV3: EmptyState and EndIndicator now use t()
- MemoBlockV3: All action labels, visibility labels, swipe hints use t()
- Add new i18n keys: memo.empty_*, memo.swipe_*, memo.clear_completed_tasks,
  memo.comment_label, memo.actions, memo.more_actions, common.now

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
- Add i18n for time formats (minutes-ago, hours-ago)
- Add try-catch with handleError for pin/delete/remove-tasks
- Replace magic numbers with Visibility enum
- Extract getMemoId/getMemoEditPath utilities
- Pre-compile word boundary regexes for performance
- Add ReDoS protection in stripMarkdown
- Add passive:true to scroll listener
- Remove unused showCreator prop

Refs #172
@hrygo hrygo force-pushed the feat/172-memo-sticky-kanban-v2 branch from 6aa94e0 to 68302a2 Compare February 13, 2026 09:28
@hrygo hrygo merged commit 9c80944 into main Feb 13, 2026
9 checks passed
@hrygo hrygo deleted the feat/172-memo-sticky-kanban-v2 branch February 13, 2026 09:29
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

[feat] MemoBlock 彩色便签纸 + MemoList 禅意看板

2 participants