Fixed two error logs

no nesting buttons inside buttons
mismatch between server and client redendered html
This commit is contained in:
t1enne
2022-05-24 22:26:04 +02:00
parent a947e67968
commit fd131a25af

View File

@@ -1,6 +1,6 @@
import { Popover } from 'antd';
import { CloseOutlined } from '@ant-design/icons';
import React, { useState } from 'react';
import React, { useState, useEffect } from 'react';
import s from './NotifyReminderPopup.module.scss';
interface Props {
@@ -13,6 +13,11 @@ interface Props {
export default function NotifyReminderPopup(props: Props) {
const { children, visible, notificationClicked, notificationClosed } = props;
const [visiblePopup, setVisiblePopup] = useState(visible);
const [mounted, setMounted] = useState(false);
useEffect(() => {
setMounted(true);
}, []);
const title = <div className={s.title}>Stay updated!</div>;
const popupStyle = {
@@ -35,16 +40,19 @@ export default function NotifyReminderPopup(props: Props) {
};
const content = (
<button type="button" onClick={popupClicked} className={s.contentbutton}>
<div>
<button type="button" className={s.closebutton} onClick={popupClosed}>
<CloseOutlined />
</button>
<button type="button" onClick={popupClicked} className={s.contentbutton}>
Click and never miss
<br />
future streams!
</button>
</div>
);
return (
mounted && (
<Popover
placement="topLeft"
defaultVisible={visiblePopup}
@@ -56,5 +64,6 @@ export default function NotifyReminderPopup(props: Props) {
>
{children}
</Popover>
)
);
}