refactor(components): rewrite Notice component

* Rename message prop to children prop and set ReactNode as type

1 files changed, 37 insertions, 0 deletions

diff --git a/src/components/atoms/notice/notice.test.tsx b/src/components/atoms/notice/notice.test.tsx
new file mode 100644
index 0000000..dd6bef6
--- /dev/null
+++ b/src/components/atoms/notice/notice.test.tsx
@@ -0,0 +1,37 @@
+import { describe, expect, it } from '@jest/globals';
+import { render, screen as rtlScreen } from '@testing-library/react';
+import { Notice } from './notice';
+
+describe('Notice', () => {
+  it('can render an error notice', () => {
+    const body = 'culpa sint ut';
+
+    render(<Notice kind="error">{body}</Notice>);
+
+    expect(rtlScreen.getByText(body)).toHaveClass('notice--error');
+  });
+
+  it('can render an informative notice', () => {
+    const body = 'labore optio rerum';
+
+    render(<Notice kind="info">{body}</Notice>);
+
+    expect(rtlScreen.getByText(body)).toHaveClass('notice--info');
+  });
+
+  it('can render a success notice', () => {
+    const body = 'dolorem voluptatem velit';
+
+    render(<Notice kind="success">{body}</Notice>);
+
+    expect(rtlScreen.getByText(body)).toHaveClass('notice--success');
+  });
+
+  it('can render a warning notice', () => {
+    const body = 'ut non nihil';
+
+    render(<Notice kind="warning">{body}</Notice>);
+
+    expect(rtlScreen.getByText(body)).toHaveClass('notice--warning');
+  });
+});