fix: 拖拽文件上传无法删除 #460
fix: 拖拽文件上传无法删除 #460
Conversation
📝 Walkthrough变更概述步骤概览在 变更
可能相关的 PR
建议的审阅者
诗歌庆祝
📜 Recent review detailsConfiguration used: CodeRabbit UI 📒 Files selected for processing (1)
💤 Files with no reviewable changes (1)
⏰ Context from checks skipped due to timeout of 90000ms (3)
Thank you for using CodeRabbit. We offer it for free to the OSS community and would appreciate your support in helping us grow. If you find it useful, would you consider giving us a shout-out on your favorite social media? 🪧 TipsChatThere are 3 ways to chat with CodeRabbit:
Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments. CodeRabbit Commands (Invoked using PR comments)
Other keywords and placeholders
CodeRabbit Configuration File (
|
|
|
Walkthrough修复了在输入框中拖拽文件上传后无法删除的问题。通过修改样式文件，解决了附件在拖拽上传后无法删除的bug。 Changes
|
![petercat-assistant[bot]](https://avatars.githubusercontent.com/in/875736?s=60&v=4){kind=small}
| @@ -162,13 +162,13 @@ const genFileCardStyle: GenerateStyle<AttachmentsToken> = (token) => { | |||
|
|
|||
| // ============================== Motion =============================== | |||
| '&-motion': { | |||
| overflow: 'hidden', | |||
| // overflow: 'hidden', | |||
There was a problem hiding this comment.
注释掉 overflow: 'hidden' 可能会影响其他样式的表现，确保这不会引入新的问题。
| transition: ['opacity', 'width', 'margin', 'padding'] | ||
| .map((prop) => `${prop} ${token.motionDurationSlow}`) | ||
| .join(','), | ||
|
|
||
| [`${cardCls}-remove`]: { | ||
| display: 'none !important', | ||
| // display: 'none !important', |
There was a problem hiding this comment.
注释掉 display: 'none !important' 可能会影响元素的可见性，确保这不会引入新的问题。
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 0
🧹 Nitpick comments (1)
components/attachments/style/fileCard.ts (1)
165-165: 修复拖拽上传文件删除按钮的可见性问题这些更改通过移除强制隐藏样式，使删除按钮在拖拽上传后可以正常显示和使用。
- 注释掉
overflow: 'hidden'确保在动画过程中内容不会被截断- 注释掉
display: 'none !important'允许删除按钮在需要时显示建议添加注释说明这些更改的原因：
- // overflow: 'hidden', + // overflow: 'hidden', // 允许删除按钮在动画期间保持可见- // display: 'none !important', + // display: 'none !important', // 修复 #431：允许拖拽上传文件的删除按钮显示Also applies to: 171-171
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (1)
components/attachments/style/fileCard.ts(1 hunks)
⏰ Context from checks skipped due to timeout of 90000ms (3)
- GitHub Check: build preview
- GitHub Check: test / react component workflow
- GitHub Check: size
🔇 Additional comments (1)
components/attachments/style/fileCard.ts (1)
165-171: 验证样式更改的影响请确认以下几点：
- 删除按钮在所有状态下（悬停、拖拽等）都能正常显示
- 动画过渡效果是否仍然平滑
- 在不同浏览器中测试这些更改的兼容性
运行以下命令检查是否有其他组件依赖这些样式：
✅ Verification successful
样式更改验证完成
经过验证，这些样式更改是安全的：
- 移除的样式仅出现在测试快照中，不会影响其他组件
- 新增的过渡动画与组件库中其他类似实现保持一致
- 删除
overflow: hidden和display: none !important有助于改善动画效果请记得更新相关的测试快照。
🏁 Scripts executed
The following scripts were executed for the analysis:
Script:
#!/bin/bash # 搜索可能受影响的相关样式 rg -l "overflow:\s*hidden" "components/" rg -l "display:\s*none\s*!important" "components/"Length of output: 229
Script:
#!/bin/bash # 搜索相关的过渡动画样式和类名 rg -A 5 "transition.*motionDurationSlow" "components/" # 搜索相关的类名使用 rg "cardCls-remove" "components/" # 检查测试快照中的相关样式 cat "components/attachments/__tests__/__snapshots__/demo.test.tsx.snap" cat "components/attachments/__tests__/__snapshots__/demo-extend.test.ts.snap"Length of output: 66947
Bundle ReportBundle size has no change ✅ |
Codecov ReportAll modified and coverable lines are covered by tests ✅
Additional details and impacted files@@ Coverage Diff @@
## main #460 +/- ##
=======================================
Coverage 91.45% 91.45%
=======================================
Files 67 67
Lines 1462 1462
Branches 385 384 -1
=======================================
Hits 1337 1337
Misses 125 125 ☔ View full report in Codecov by Sentry. |
|
注释的代码直接删了吧～其他没问题了 |
…o feature/attachments-remove
…o feature/attachments-remove
问题来源
Sender 输入框的黏贴图片示例, 当直接向输入框拖拽图片等附件时, 资源无法被删除 #431
修复问题
问题定位
修复后
Summary by CodeRabbit