Merge pull request #1 from zfir-dev/first-version

First version

.editorconfig

@@ -0,0 +1,19 @@
+# EditorConfig helps developers define and maintain consistent
+# coding styles between different editors and IDEs
+# editorconfig.org
+
+root = true
+
+[*]
+end_of_line = lf
+charset = utf-8
+trim_trailing_whitespace = true
+insert_final_newline = true
+indent_style = space
+indent_size = 2
+
+[*.hbs]
+insert_final_newline = false
+
+[*.{diff,md}]
+trim_trailing_whitespace = false

.ember-cli

@@ -0,0 +1,7 @@
+{
+  /**
+    Setting `isTypeScriptProject` to true will force the blueprint generators to generate TypeScript
+    rather than JavaScript by default, when a TypeScript version of a given blueprint is available.
+  */
+  "isTypeScriptProject": false
+}

.eslintignore

@@ -0,0 +1,13 @@
+# unconventional js
+/blueprints/*/files/
+
+# compiled output
+/dist/
+
+# misc
+/coverage/
+!.*
+.*/
+
+# ember-try
+/.node_modules.ember-try/

.eslintrc.js

@@ -0,0 +1,56 @@
+'use strict';
+
+module.exports = {
+  root: true,
+  parser: '@babel/eslint-parser',
+  parserOptions: {
+    ecmaVersion: 'latest',
+    sourceType: 'module',
+    requireConfigFile: false,
+    babelOptions: {
+      plugins: [
+        ['@babel/plugin-proposal-decorators', { decoratorsBeforeExport: true }],
+      ],
+    },
+  },
+  plugins: ['ember'],
+  extends: [
+    'eslint:recommended',
+    'plugin:ember/recommended',
+    'plugin:prettier/recommended',
+  ],
+  env: {
+    browser: true,
+  },
+  rules: {},
+  overrides: [
+    // node files
+    {
+      files: [
+        './.eslintrc.js',
+        './.prettierrc.js',
+        './.stylelintrc.js',
+        './.template-lintrc.js',
+        './ember-cli-build.js',
+        './testem.js',
+        './blueprints/*/index.js',
+        './config/**/*.js',
+        './lib/*/index.js',
+        './server/**/*.js',
+      ],
+      parserOptions: {
+        sourceType: 'script',
+      },
+      env: {
+        browser: false,
+        node: true,
+      },
+      extends: ['plugin:n/recommended'],
+    },
+    {
+      // test files
+      files: ['tests/**/*-test.{js,ts}'],
+      extends: ['plugin:qunit/recommended'],
+    },
+  ],
+};

.github/workflows/ci.yml

@@ -0,0 +1,47 @@
+name: CI
+
+on:
+  push:
+    branches:
+      - main
+      - master
+  pull_request: {}
+
+concurrency:
+  group: ci-${{ github.head_ref || github.ref }}
+  cancel-in-progress: true
+
+jobs:
+  lint:
+    name: "Lint"
+    runs-on: ubuntu-latest
+    timeout-minutes: 10
+
+    steps:
+      - uses: actions/checkout@v3
+      - name: Install Node
+        uses: actions/setup-node@v3
+        with:
+          node-version: 18
+          cache: npm
+      - name: Install Dependencies
+        run: npm ci
+      - name: Lint
+        run: npm run lint
+
+  test:
+    name: "Test"
+    runs-on: ubuntu-latest
+    timeout-minutes: 10
+
+    steps:
+      - uses: actions/checkout@v3
+      - name: Install Node
+        uses: actions/setup-node@v3
+        with:
+          node-version: 18
+          cache: npm
+      - name: Install Dependencies
+        run: npm ci
+      - name: Run Tests
+        run: npm test

.gitignore

@@ -0,0 +1,25 @@
+# compiled output
+/dist/
+/declarations/
+
+# dependencies
+/node_modules/
+
+# misc
+/.env*
+/.pnp*
+/.eslintcache
+/coverage/
+/npm-debug.log*
+/testem.log
+/yarn-error.log
+
+# ember-try
+/.node_modules.ember-try/
+/npm-shrinkwrap.json.ember-try
+/package.json.ember-try
+/package-lock.json.ember-try
+/yarn.lock.ember-try
+
+# broccoli-debug
+/DEBUG/

.prettierignore

@@ -0,0 +1,13 @@
+# unconventional js
+/blueprints/*/files/
+
+# compiled output
+/dist/
+
+# misc
+/coverage/
+!.*
+.*/
+
+# ember-try
+/.node_modules.ember-try/

.prettierrc.js

@@ -0,0 +1,12 @@
+'use strict';
+
+module.exports = {
+  overrides: [
+    {
+      files: '*.{js,ts}',
+      options: {
+        singleQuote: true,
+      },
+    },
+  ],
+};

.stylelintignore

@@ -0,0 +1,8 @@
+# unconventional files
+/blueprints/*/files/
+
+# compiled output
+/dist/
+
+# addons
+/.node_modules.ember-try/

.stylelintrc.js

@@ -0,0 +1,5 @@
+'use strict';
+
+module.exports = {
+  extends: ['stylelint-config-standard', 'stylelint-prettier/recommended'],
+};

.template-lintrc.js

@@ -0,0 +1,5 @@
+'use strict';
+
+module.exports = {
+  extends: 'recommended',
+};

.watchmanconfig

@@ -0,0 +1,3 @@
+{
+  "ignore_dirs": ["dist"]
+}

README.md

@@ -0,0 +1,56 @@
+# devcon-2024-ember-test
+
+This README outlines the details of collaborating on this Ember application.
+A short introduction of this app could easily go here.
+
+## Prerequisites
+
+You will need the following things properly installed on your computer.
+
+* [Git](https://git-scm.com/)
+* [Node.js](https://nodejs.org/) (with npm)
+* [Ember CLI](https://cli.emberjs.com/release/)
+* [Google Chrome](https://google.com/chrome/)
+
+## Installation
+
+* `git clone <repository-url>` this repository
+* `cd devcon-2024-ember-test`
+* `npm install`
+
+## Running / Development
+
+* `npm run start`
+* Visit your app at [http://localhost:4200](http://localhost:4200).
+* Visit your tests at [http://localhost:4200/tests](http://localhost:4200/tests).
+
+### Code Generators
+
+Make use of the many generators for code, try `ember help generate` for more details
+
+### Running Tests
+
+* `npm run test`
+* `npm run test:ember -- --server`
+
+### Linting
+
+* `npm run lint`
+* `npm run lint:fix`
+
+### Building
+
+* `npm exec ember build` (development)
+* `npm run build` (production)
+
+### Deploying
+
+Specify what it takes to deploy your app.
+
+## Further Reading / Useful Links
+
+* [ember.js](https://emberjs.com/)
+* [ember-cli](https://cli.emberjs.com/release/)
+* Development Browser Extensions
+  * [ember inspector for chrome](https://chrome.google.com/webstore/detail/ember-inspector/bmdblncegkenkacieihfhpjfppoconhi)
+  * [ember inspector for firefox](https://addons.mozilla.org/en-US/firefox/addon/ember-inspector/)

app/app.js

@@ -0,0 +1,12 @@
+import Application from '@ember/application';
+import Resolver from 'ember-resolver';
+import loadInitializers from 'ember-load-initializers';
+import config from 'devcon-2024-ember-test/config/environment';
+
+export default class App extends Application {
+  modulePrefix = config.modulePrefix;
+  podModulePrefix = config.podModulePrefix;
+  Resolver = Resolver;
+}
+
+loadInitializers(App, config.modulePrefix);

app/components/input-modal.hbs

@@ -0,0 +1,16 @@
+<!-- app/components/input-modal.hbs -->
+<div class="input-modal">
+  <div class="modal-content">
+    <button {{on "click" this.closeModal}}>X</button>
+    <label>First Name</label>
+    <input type="text" value={{this.firstName}} {{on "input" this.updateFirstName}} />
+
+    <label>Last Name</label>
+    <input type="text" value={{this.lastName}} {{on "input" this.updateLastName}} />
+
+    <label>Email</label>
+    <input type="email" value={{this.email}} {{on "input" this.updateEmail}} />
+
+    <button {{on "click" this.save}}>Save</button>
+  </div>
+</div>

app/components/open-modal-button.hbs

@@ -0,0 +1,5 @@
+<!-- app/components/open-modal-button.hbs -->
+<button {{on "click" this.openModal}}>Open Modal</button>
+{{#if this.isModalOpen}}
+  <InputModal @closeModal={{this.closeModal}} />
+{{/if}}

app/config/environment.d.ts

@@ -0,0 +1,14 @@
+/**
+ * Type declarations for
+ *    import config from 'my-app/config/environment'
+ */
+declare const config: {
+  environment: string;
+  modulePrefix: string;
+  podModulePrefix: string;
+  locationType: 'history' | 'hash' | 'none' | 'auto';
+  rootURL: string;
+  APP: Record<string, unknown>;
+};
+
+export default config;

app/controllers/input-modal.ts

@@ -0,0 +1,42 @@
+// app/components/input-modal.ts
+import Component from '@glimmer/component';
+import { tracked } from '@glimmer/tracking';
+import { action } from '@ember/object';
+
+interface InputModalArgs {
+  closeModal: () => void;
+}
+
+export default class InputModalComponent extends Component<InputModalArgs> {
+  @tracked firstName = '';
+  @tracked lastName = '';
+  @tracked email = '';
+
+  @action
+  updateFirstName(event: Event) {
+    this.firstName = (event.target as HTMLInputElement).value;
+  }
+
+  @action
+  updateLastName(event: Event) {
+    this.lastName = (event.target as HTMLInputElement).value;
+  }
+
+  @action
+  updateEmail(event: Event) {
+    this.email = (event.target as HTMLInputElement).value;
+  }
+
+  @action
+  closeModal() {
+    if (this.args.closeModal) {
+      this.args.closeModal();
+    }
+  }
+
+  @action
+  save() {
+    alert('Data saved successfully!');
+    this.closeModal();
+  }
+}

app/controllers/open-modal-button.ts

@@ -0,0 +1,19 @@
+// app/components/open-modal-button.ts
+import Component from '@glimmer/component';
+import { action } from '@ember/object';
+import { tracked } from '@glimmer/tracking';
+
+export default class OpenModalButtonComponent extends Component {
+  @tracked isModalOpen = false;
+
+  @action
+  openModal() {
+    console.log('openModal');
+    this.isModalOpen = true;
+  }
+
+  @action
+  closeModal() {
+    this.isModalOpen = false;
+  }
+}