Replace alert and confirm with custom modals.

[igardev]

Replace alert and confirm with custom modals. This is needed as Webview in VS Code doesn't permit alert and confirm for security reasons.

[ngxson]

Thanks for looking into this, I wanted to do it this way but don't yet have time.

However, just thinking, can we make this a react context provider? I think having a provider which provides a function equivalent to window.confirm/prompt can make it easier to be reused in different places in the code base.

For example, in the code of deleteConversation, we can do something like this:

// somewhere at the beginning of the component
const { showConfirm } = useDialog();

// then, inside the handler
if (await showConfirm()) {
  // delete the conv
}

[ngxson]

for a11y, this should be an element of type dialog

[ngxson]

same here

[igardev]

Thanks for looking into this, I wanted to do it this way but don't yet have time.

However, just thinking, can we make this a react context provider? I think having a provider which provides a function equivalent to window.confirm/prompt can make it easier to be reused in different places in the code base.

For example, in the code of deleteConversation, we can do something like this:

// somewhere at the beginning of the component
const { showConfirm } = useDialog();

// then, inside the handler
if (await showConfirm()) {
  // delete the conv
}

I think I understand what you mean. Will try to do it tomorrow.

[igardev]

@ngxson I've changed it to simplify the usage of custom modals.
Just for information - I've noticed that in full screen I don't see the "..." button for the conversations in the sidebar and can't resize the sidebar to show it.