Skip to content

Commit

Permalink
Show warning when using browsers without BYOB
Browse files Browse the repository at this point in the history
sleepyfran committed Oct 21, 2024

Verified

This commit was signed with the committer’s verified signature.
sleepyfran Fran González
1 parent b52a979 commit cb7035c
Showing 2 changed files with 23 additions and 0 deletions.
21 changes: 21 additions & 0 deletions packages/components/initial-setup/src/initial-setup.ts
Original file line number Diff line number Diff line change
@@ -14,6 +14,13 @@ export class InitialSetup extends LitElement {
@query("echo-dialog")
private _dialog!: EchoDialog;

/**
* We need to check if the browser supports BYOB readers because it's an
* essential dependency for the file-based providers to work. If we don't,
* we can't use the file-based providers.
*/
private supportsBYOBReader = !!globalThis.ReadableStreamBYOBReader;

static styles = css`
:host {
display: flex;
@@ -26,6 +33,11 @@ export class InitialSetup extends LitElement {
div.initial-setup {
max-width: 40%;
}
p.partial-support-warning {
background-color: var(--warning-color);
padding: 1em;
}
`;

render() {
@@ -40,6 +52,15 @@ export class InitialSetup extends LitElement {
<echo-button @click=${this._onAddProviderClick}
>Add provider</echo-button
>
${!this.supportsBYOBReader
? html`<p class="partial-support-warning">
Your browser (most likely Safari) does not support an essential
feature for file-based providers to work. You can still use other
providers, but expect strange behavior when using providers like
OneDrive.
</p>`
: ""}
</div>
${this._renderAddProviderModal()}
`;
2 changes: 2 additions & 0 deletions packages/web/index.html
Original file line number Diff line number Diff line change
@@ -25,6 +25,7 @@
--secondary-text-color: #555555;
--accent-color: #ff6f61;
--error-color: #dc3545;
--warning-color: #ffc107;
--button-background-color: #007bff;
--button-text-color: #ffffff;
--button-hover-background-color: #0056b3;
@@ -48,6 +49,7 @@
--background-color: #2e2e2e;
--background-color-muted: #3c3c3c;
--border-color: #3c3c3c;
--warning-color: #91731b;
--disabled-background-color: #666666;
--primary-text-color: #f4f4f9;
--secondary-text-color: #cccccc;

0 comments on commit cb7035c

Please sign in to comment.