DEV: [gjs-codemod] Convert all templates to gjs

.discourse-compatibility

@@ -1,3 +1,4 @@
+< 3.5.0.beta5-dev: e71a243cfca147d8ac24b504044614ce5fd09cef
 < 3.5.0.beta1-dev: 54a7970fd9ae1609e453199aeba5fe582b5e3672
 < 3.4.0.beta2-dev: 1eef24bc58166e366a66676cae1990f9308b95e7
 < 3.4.0.beta1-dev: 0beedd0add742911ac8fa2969d74ca050c8d7417

Gemfile.lock

@@ -14,42 +14,44 @@ GEM
       securerandom (>= 0.3)
       tzinfo (~> 2.0, >= 2.0.5)
       uri (>= 0.13.1)
-    ast (2.4.2)
-    base64 (0.2.0)
-    benchmark (0.4.0)
-    bigdecimal (3.1.9)
+    ast (2.4.3)
+    base64 (0.3.0)
+    benchmark (0.4.1)
+    bigdecimal (3.2.0)
     concurrent-ruby (1.3.5)
-    connection_pool (2.5.0)
-    drb (2.2.1)
+    connection_pool (2.5.3)
+    drb (2.2.3)
     i18n (1.14.7)
       concurrent-ruby (~> 1.0)
-    json (2.10.2)
-    language_server-protocol (3.17.0.4)
+    json (2.12.2)
+    language_server-protocol (3.17.0.5)
     lint_roller (1.1.0)
-    logger (1.6.6)
+    logger (1.7.0)
     minitest (5.25.5)
-    parallel (1.26.3)
-    parser (3.3.7.1)
+    parallel (1.27.0)
+    parser (3.3.8.0)
       ast (~> 2.4.1)
       racc
     prettier_print (1.2.1)
+    prism (1.4.0)
     racc (1.8.1)
-    rack (3.1.12)
+    rack (3.1.15)
     rainbow (3.1.1)
     regexp_parser (2.10.0)
-    rubocop (1.74.0)
+    rubocop (1.75.8)
       json (~> 2.3)
       language_server-protocol (~> 3.17.0.2)
       lint_roller (~> 1.1.0)
       parallel (~> 1.10)
       parser (>= 3.3.0.2)
       rainbow (>= 2.2.2, < 4.0)
       regexp_parser (>= 2.9.3, < 3.0)
-      rubocop-ast (>= 1.38.0, < 2.0)
+      rubocop-ast (>= 1.44.0, < 2.0)
       ruby-progressbar (~> 1.7)
       unicode-display_width (>= 2.4.0, < 4.0)
-    rubocop-ast (1.38.1)
-      parser (>= 3.3.1.0)
+    rubocop-ast (1.44.1)
+      parser (>= 3.3.7.2)
+      prism (~> 1.4)
     rubocop-capybara (2.22.1)
       lint_roller (~> 1.1)
       rubocop (~> 1.72, >= 1.72.1)
@@ -65,13 +67,13 @@ GEM
     rubocop-factory_bot (2.27.1)
       lint_roller (~> 1.1)
       rubocop (~> 1.72, >= 1.72.1)
-    rubocop-rails (2.30.3)
+    rubocop-rails (2.32.0)
       activesupport (>= 4.2.0)
       lint_roller (~> 1.1)
       rack (>= 1.1)
-      rubocop (>= 1.72.1, < 2.0)
-      rubocop-ast (>= 1.38.0, < 2.0)
-    rubocop-rspec (3.5.0)
+      rubocop (>= 1.75.0, < 2.0)
+      rubocop-ast (>= 1.44.0, < 2.0)
+    rubocop-rspec (3.6.0)
       lint_roller (~> 1.1)
       rubocop (~> 1.72, >= 1.72.1)
     rubocop-rspec_rails (2.31.0)
@@ -97,4 +99,4 @@ DEPENDENCIES
   syntax_tree
 
 BUNDLED WITH
-   2.6.6
+   2.6.9

assets/javascripts/discourse/components/teambuild-choice.gjs

@@ -0,0 +1,53 @@
+import Component from "@ember/component";
+import { action, computed } from "@ember/object";
+import { tagName } from "@ember-decorators/component";
+import DButton from "discourse/components/d-button";
+import icon from "discourse/helpers/d-icon";
+
+@tagName("")
+export default class TeambuildChoice extends Component {
+  @computed("progress.completed.[]")
+  get completed() {
+    return this.progress.isComplete(this.target, this.userId);
+  }
+
+  @action
+  complete() {
+    this.progress.complete(this.target, this.userId);
+  }
+
+  @action
+  undo() {
+    this.progress.undo(this.target, this.userId);
+  }
+
+  <template>
+    <div
+      class="teambuild-choice {{if this.completed 'completed' 'incomplete'}}"
+    >
+      <div class="controls">
+        {{#if this.readOnly}}
+          {{#if this.completed}}
+            {{icon "check"}}
+          {{/if}}
+        {{else}}
+          {{#if this.completed}}
+            <DButton
+              @icon="check"
+              @action={{this.undo}}
+              @title="discourse_teambuild.progress.mark_incomplete"
+              class="btn-primary"
+            />
+          {{else}}
+            <DButton
+              @icon="circle"
+              @action={{this.complete}}
+              @title="discourse_teambuild.progress.mark_complete"
+            />
+          {{/if}}
+        {{/if}}
+      </div>
+      <div class="choice-label">{{this.label}}</div>
+    </div>
+  </template>
+}

assets/javascripts/discourse/components/teambuild-target.gjs

@@ -0,0 +1,182 @@
+import Component, { Input } from "@ember/component";
+import { concat, fn } from "@ember/helper";
+import { action, computed } from "@ember/object";
+import { equal, or } from "@ember/object/computed";
+import { underscore } from "@ember/string";
+import { tagName } from "@ember-decorators/component";
+import BufferedProxy from "ember-buffered-proxy/proxy";
+import DButton from "discourse/components/d-button";
+import RadioButton from "discourse/components/radio-button";
+import replaceEmoji from "discourse/helpers/replace-emoji";
+import { popupAjaxError } from "discourse/lib/ajax-error";
+import { i18n } from "discourse-i18n";
+import ComboBox from "select-kit/components/combo-box";
+import { Types } from "discourse/plugins/discourse-teambuild/discourse/models/teambuild-target";
+
+@tagName("")
+export default class TeambuildTarget extends Component {
+  editSelected = false;
+
+  @equal("buffered.target_type_id", Types.USER_GROUP) needsGroup;
+  @or("editSelected", "target.isNew") editing;
+
+  @computed("target")
+  get buffered() {
+    return BufferedProxy.create({
+      content: this.get("target"),
+    });
+  }
+
+  @computed("editing", "index")
+  get canMoveUp() {
+    return !this.editing && this.index > 0;
+  }
+
+  @computed("editing", "index", "length")
+  get canMoveDown() {
+    return !this.editing && this.index < this.length - 1;
+  }
+
+  get targetTypes() {
+    return Object.keys(Types).map((key) => {
+      return { id: Types[key], name: underscore(key) };
+    });
+  }
+
+  @computed(
+    "buffered.name",
+    "target.isSaving",
+    "needsGroup",
+    "buffered.group_id"
+  )
+  get saveDisabled() {
+    if (this.target.isSaving) {
+      return true;
+    }
+
+    let name = this.get("buffered.name");
+    if (!name || name.length === 0) {
+      return true;
+    }
+
+    if (this.needsGroup && !this.get("buffered.group_id")) {
+      return true;
+    }
+
+    return false;
+  }
+
+  @action
+  save() {
+    this.target
+      .save(this.buffered.getProperties("name", "target_type_id", "group_id"))
+      .then(() => {
+        this.set("editSelected", false);
+      })
+      .catch(popupAjaxError);
+  }
+
+  @action
+  cancel() {
+    if (this.target.isNew) {
+      return this.removeTarget();
+    } else {
+      this.set("editSelected", false);
+      this.buffered.discardChanges();
+    }
+  }
+
+  @action
+  destroyTarget() {
+    this.target.destroyRecord().then(() => this.removeTarget());
+  }
+
+  <template>
+    <div class="teambuild-target {{if this.editing 'editing'}}">
+      <div class="target-details">
+        {{#if this.editing}}
+          <div class="fields">
+            <div class="target-types">
+              {{#each this.targetTypes as |type|}}
+                <label>
+                  <RadioButton
+                    @value={{type.id}}
+                    @selection={{this.buffered.target_type_id}}
+                    @onChange={{fn (mut this.buffered.target_type_id) type.id}}
+                    class={{type.name}}
+                  />
+                  {{i18n
+                    (concat "discourse_teambuild.targets.types." type.name)
+                  }}
+                </label>
+              {{/each}}
+            </div>
+
+            <div class="target-name">
+              <Input
+                @value={{this.buffered.name}}
+                placeholder={{i18n "discourse_teambuild.targets.name"}}
+                autofocus="true"
+              />
+            </div>
+
+            {{#if this.needsGroup}}
+              <ComboBox
+                @content={{this.groups}}
+                @value={{this.buffered.group_id}}
+                @none="discourse_teambuild.targets.choose_group"
+              />
+            {{/if}}
+          </div>
+        {{else}}
+          <div class="target-name">
+            {{replaceEmoji this.target.name}}
+          </div>
+          <div class="target-group-name">
+            {{this.target.group_name}}
+          </div>
+        {{/if}}
+      </div>
+      <div class="controls">
+        {{#if this.canMoveUp}}
+          <DButton @icon="arrow-up" @action={{this.moveUp}} />
+        {{/if}}
+
+        {{#if this.canMoveDown}}
+          <DButton @icon="arrow-down" @action={{this.moveDown}} />
+        {{/if}}
+
+        {{#if this.editing}}
+          <DButton
+            @icon="check"
+            @title="discourse_teambuild.targets.save"
+            @action={{this.save}}
+            @disabled={{this.saveDisabled}}
+            class="btn-primary save"
+          />
+
+          <DButton
+            @icon="xmark"
+            @action={{this.cancel}}
+            @title="discourse_teambuild.targets.cancel"
+            class="btn-danger cancel"
+          />
+        {{else}}
+          <DButton
+            @icon="pencil"
+            @title="discourse_teambuild.targets.edit"
+            @action={{fn (mut this.editSelected) true}}
+            class="edit"
+          />
+
+          <DButton
+            @icon="trash-can"
+            @title="discourse_teambuild.targets.delete"
+            @action={{this.destroyTarget}}
+            class="btn-danger destroy"
+          />
+        {{/if}}
+      </div>
+    </div>
+  </template>
+}