mirrors/puter
1
0
Fork 0
mirror of https://github.com/HeyPuter/puter synced 2024-11-14 22:06:00 +00:00
Code Issues Packages Projects Releases Wiki Activity

refactor: Replace component definition boilerplate with a function

Browse Source 
Also, we can ask the CustomElementRegistry if it has an entry with a
given name, instead of polluting the window object.
This commit is contained in:
Sam Atkins 2024-05-08 14:25:09 +01:00
parent 9267b50666
commit 1b2608d6ee
14 changed files with 34 additions and 98 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
src/UI/Components/Button.js
View File

@ -1,4 +1,4 @@
import { Component } from "../../util/Component.js";
import { Component, defineComponent } from "../../util/Component.js";
export default class Button extends Component {
static PROPERTIES = {
@ -64,10 +64,4 @@ export default class Button extends Component {
}
}
// TODO: This is necessary because files can be loaded from
// both `/src/UI` and `/UI` in the URL; we need to fix that
if ( ! window.__component_button ) {
window.__component_button = true;
customElements.define('c-button', Button);
}
defineComponent('c-button', Button);

10
src/UI/Components/CodeEntryView.js
View File

@ -1,4 +1,4 @@
import { Component } from "../../util/Component.js";
import { Component, defineComponent } from "../../util/Component.js";
export default class CodeEntryView extends Component {
static PROPERTIES = {
@ -215,10 +215,4 @@ export default class CodeEntryView extends Component {
}
}
// TODO: This is necessary because files can be loaded from
// both `/src/UI` and `/UI` in the URL; we need to fix that
if ( ! window.__component_codeEntryView ) {
window.__component_codeEntryView = true;
customElements.define('c-code-entry-view', CodeEntryView);
}
defineComponent('c-code-entry-view', CodeEntryView);

10
src/UI/Components/ConfirmationsView.js
View File

@ -1,4 +1,4 @@
import { Component } from "../../util/Component.js";
import { Component, defineComponent } from "../../util/Component.js";
/**
* Display a list of checkboxes for the user to confirm.
@ -58,10 +58,4 @@ export default class ConfirmationsView extends Component {
}
}
// TODO: This is necessary because files can be loaded from
// both `/src/UI` and `/UI` in the URL; we need to fix that
if ( ! window.__component_confirmationsView ) {
window.__component_confirmationsView = true;
customElements.define('c-confirmations-view', ConfirmationsView);
}
defineComponent('c-confirmations-view', ConfirmationsView);

10
src/UI/Components/Flexer.js
View File

@ -1,4 +1,4 @@
import { Component } from "../../util/Component.js";
import { Component, defineComponent } from "../../util/Component.js";
/**
* Allows a flex layout of composed components to be
@ -38,10 +38,4 @@ export default class Flexer extends Component {
}
}
// TODO: This is necessary because files can be loaded from
// both `/src/UI` and `/UI` in the URL; we need to fix that
if ( ! window.__component_flexer ) {
window.__component_flexer = true;
customElements.define('c-flexer', Flexer);
}
defineComponent('c-flexer', Flexer);

10
src/UI/Components/JustHTML.js
View File

@ -1,4 +1,4 @@
import { Component } from "../../util/Component.js";
import { Component, defineComponent } from "../../util/Component.js";
/**
* Allows using an HTML string as a component.
@ -15,10 +15,4 @@ export default class JustHTML extends Component {
}
}
// TODO: This is necessary because files can be loaded from
// both `/src/UI` and `/UI` in the URL; we need to fix that
if ( ! window.__component_justHTML ) {
window.__component_justHTML = true;
customElements.define('c-just-html', JustHTML);
}
defineComponent('c-just-html', JustHTML);

10
src/UI/Components/QRCode.js
View File

@ -1,4 +1,4 @@
import { Component } from "../../util/Component.js";
import { Component, defineComponent } from "../../util/Component.js";
import UIComponentWindow from "../UIComponentWindow.js";
export default class QRCodeView extends Component {
@ -78,10 +78,4 @@ export default class QRCodeView extends Component {
}
}
// TODO: This is necessary because files can be loaded from
// both `/src/UI` and `/UI` in the URL; we need to fix that
if ( ! window.__component_qr_code ) {
window.__component_qr_code = true;
customElements.define('c-qr-code', QRCodeView);
}
defineComponent('c-qr-code', QRCodeView);

4
src/UI/Components/RecoveryCodeEntryView.js
View File

@ -1,4 +1,4 @@
import { Component } from "../../util/Component.js";
import { Component, defineComponent } from "../../util/Component.js";
export default class RecoveryCodeEntryView extends Component {
static PROPERTIES = {
@ -84,4 +84,4 @@ export default class RecoveryCodeEntryView extends Component {
}
}
customElements.define('c-recovery-code-entry', RecoveryCodeEntryView);
defineComponent('c-recovery-code-entry', RecoveryCodeEntryView);

10
src/UI/Components/RecoveryCodesView.js
View File

@ -1,4 +1,4 @@
import { Component } from "../../util/Component.js";
import { Component, defineComponent } from "../../util/Component.js";
export default class RecoveryCodesView extends Component {
static PROPERTIES = {
@ -91,10 +91,4 @@ export default class RecoveryCodesView extends Component {
}
}
// TODO: This is necessary because files can be loaded from
// both `/src/UI` and `/UI` in the URL; we need to fix that
if ( ! window.__component_recoveryCodesView ) {
window.__component_recoveryCodesView = true;
customElements.define('c-recovery-codes-view', RecoveryCodesView);
}
defineComponent('c-recovery-codes-view', RecoveryCodesView);

10
src/UI/Components/Slider.js
View File

@ -16,7 +16,7 @@
* You should have received a copy of the GNU Affero General Public License
* along with this program. If not, see <https://www.gnu.org/licenses/>.
*/
import { Component } from "../../util/Component.js";
import { Component, defineComponent } from "../../util/Component.js";
/**
* Slider: A labeled slider input.
@ -105,10 +105,4 @@ export default class Slider extends Component {
}
}
// TODO: This is necessary because files can be loaded from
// both `/src/UI` and `/UI` in the URL; we need to fix that
if ( ! window.__component_slider ) {
window.__component_slider = true;
customElements.define('c-slider', Slider);
}
defineComponent('c-slider', Slider);

10
src/UI/Components/StepHeading.js
View File

@ -1,4 +1,4 @@
import { Component } from "../../util/Component.js";
import { Component, defineComponent } from "../../util/Component.js";
/**
* StepHeading renders a heading with a leading symbol.
@ -58,10 +58,4 @@ export default class StepHeading extends Component {
}
}
// TODO: This is necessary because files can be loaded from
// both `/src/UI` and `/UI` in the URL; we need to fix that
if ( ! window.__component_stepHeading ) {
window.__component_stepHeading = true;
customElements.define('c-step-heading', StepHeading);
}
defineComponent('c-step-heading', StepHeading);

10
src/UI/Components/StepView.js
View File

@ -1,4 +1,4 @@
import { Component } from "../../util/Component.js";
import { Component, defineComponent } from "../../util/Component.js";
export default class StepView extends Component {
static PROPERTIES = {
@ -64,10 +64,4 @@ export default class StepView extends Component {
}
}
// TODO: This is necessary because files can be loaded from
// both `/src/UI` and `/UI` in the URL; we need to fix that
if ( ! window.__component_stepView ) {
window.__component_stepView = true;
customElements.define('c-step-view', StepView);
}
defineComponent('c-step-view', StepView);

10
src/UI/Components/StringView.js
View File

@ -1,4 +1,4 @@
import { Component } from "../../util/Component.js";
import { Component, defineComponent } from "../../util/Component.js";
/**
* A simple component that displays a string in the
@ -42,10 +42,4 @@ export default class StringView extends Component {
}
}
// TODO: This is necessary because files can be loaded from
// both `/src/UI` and `/UI` in the URL; we need to fix that
if ( ! window.__component_stringView ) {
window.__component_stringView = true;
customElements.define('c-string-view', StringView);
}
defineComponent('c-string-view', StringView);

10
src/UI/Components/TestView.js
View File

@ -1,4 +1,4 @@
import { Component } from "../../util/Component.js";
import { Component, defineComponent } from "../../util/Component.js";
/**
* A simple component when you just need to test something.
@ -19,10 +19,4 @@ export default class TestView extends Component {
}
}
// TODO: This is necessary because files can be loaded from
// both `/src/UI` and `/UI` in the URL; we need to fix that
if ( ! window.__component_testView ) {
window.__component_testView = true;
customElements.define('c-test-view', TestView);
}
defineComponent('c-test-view', TestView);

8
src/util/Component.js
View File

@ -136,3 +136,11 @@ export class Component extends HTMLElement {
};
}
}
export const defineComponent = (name, component) => {
// TODO: This is necessary because files can be loaded from
// both `/src/UI` and `/UI` in the URL; we need to fix that
if ( ! customElements.get(name) ) {
customElements.define(name, component);
}
};