fix: add a close button to comment input

[tu2463]

Changes

This PR resolves #1606 dailydotdev/daily#1606

• Added a CloseButton component to the MarkdownInput component, so that we can see a "X" on the top-right corner of the comment box.

• Let CommentInputOrModal passes onClose to CommentMarkdownInput as a prop "onRequestClose". This function is eventually passed to MarkdownInput, so that clicking the close button can cancel the comment.

Manual Testing

Caution

Please make sure existing components are not breaking/affected by this PR

1. Go to a post
2. Click on comment button
3. Should see the comment box with a close button. Clicking the close button will cancel the comment.

-->

[vercel]

@tu2463 is attempting to deploy a commit to the Daily Dev Team on Vercel.

A member of the Team first needs to authorize it.

[sshanzel]

There can be places where this was used, to support backwards compat, and only show this when needed, let's do a conditional.

Suggested change

	<CloseButton
	size={ButtonSize.XSmall}
	className="absolute right-1 top-1 laptop:right-3 laptop:top-3"
	onClick={onRequestClose}
	/>
	{onRequestClose && (
	<CloseButton
	size={ButtonSize.XSmall}
	className="absolute right-1 top-1 laptop:right-3 laptop:top-3"
	onClick={onRequestClose}
	/>
	)}

[sshanzel]

Great work! Thank you for your effort 🙏

After this, there should be two components we'll need to update to make this work on desktop. The MainComment and SubComment components contain a conditional render on the input field we display, we should pass the onRequestClose value to be a function that clears the state that manages the input itself.