Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat: Modal hooks confirm function support await #43470

Merged
merged 5 commits into from Jul 11, 2023
Merged

Conversation

zombieJ
Copy link
Member

@zombieJ zombieJ commented Jul 10, 2023

[中文版模板 / Chinese template]

🤔 This is a ...

  • New feature
  • Bug fix
  • Site / documentation update
  • Demo update
  • Component style update
  • TypeScript definition update
  • Bundle size optimization
  • Performance optimization
  • Enhancement feature
  • Internationalization
  • Refactoring
  • Code style optimization
  • Test Case
  • Branch merge
  • Workflow
  • Other (about what?)

🔗 Related issue link

ref #43295

💡 Background and solution

📝 Changelog

Language Changelog
🇺🇸 English Modal hooks function support await call.
🇨🇳 Chinese Modal hooks 方法支持 await 调用。

☑️ Self-Check before Merge

⚠️ Please check all items below before requesting a reviewing. ⚠️

  • Doc is updated/provided or not needed
  • Demo is updated/provided or not needed
  • TypeScript definition is updated/provided or not needed
  • Changelog is provided or not needed

🚀 Summary

🤖 Generated by Copilot at e7e0285

This pull request enhances the modal component and its hooks method, by adding new props and features. It allows the modal to optionally suppress error messages, return a promise with the user's choice, and customize the close behavior. It also updates the demo code, the tests, and the documentation for the modal component in both English and Chinese. It mainly affects the files components/modal/*, components/_util/ActionButton.tsx, and components/modal/demo/hooks.md.

🔍 Walkthrough

🤖 Generated by Copilot at e7e0285

  • Add isSilent prop to ActionButton and ConfirmDialog components to control error throwing behavior (link, link, link, link, link, link, link)
  • Add onClose prop to ConfirmDialog and HookModal components to support await operation for hooks method of modal (link, link, link, link, link, link, link)
  • Modify useModal hook to return modal functions with then field that returns a promise that resolves with confirmed value (link, link, link, link, link, link, link)
  • Update hooks.tsx demo code to use async and await keywords and log confirmed value (link, link, link)
  • Update hook.test.tsx file to add test case for await operation (link)
  • Update documentation files (hooks.md, index.en-US.md, index.zh-CN.md) to explain await operation and link to relevant demo codes (link, link, link, link, link, link, link)

@stackblitz
Copy link

stackblitz bot commented Jul 10, 2023

Review PR in StackBlitz Codeflow Run & review this pull request in StackBlitz Codeflow.

@github-actions
Copy link
Contributor

github-actions bot commented Jul 10, 2023

@github-actions
Copy link
Contributor

size-limit report 📦

Path Size
./dist/antd.min.js 381.17 KB (+155 B 🔺)
./dist/antd-with-locales.min.js 440.77 KB (+184 B 🔺)

@zombieJ zombieJ merged commit b072d3a into feature Jul 11, 2023
85 checks passed
@zombieJ zombieJ deleted the modal-promise branch July 11, 2023 01:58

```tsx
//点击 `onOk` 时返回 `true`,点击 `onCancel` 时返回 `false`
const confirmed = await modal.confirm({ ... });
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

声明一下版本?

Wxh16144 pushed a commit to Wxh16144-forks/ant-design that referenced this pull request Jul 12, 2023
* docs: move demo to useModal

* docs: reorder

* chore: update ts def

* test: test case

* chore: fix compile
then<T>(resolve: (confirmed: boolean) => T, reject: VoidFunction): Promise<T>;
};

export type HookAPI = Omit<Record<keyof ModalStaticFunctions, ModalFuncWithPromise>, 'warn'>;
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

UseModalResult?导出去名字规范些

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.

None yet

5 participants