Fixed deprecation warnings and bugs on page operations

.eslintrc

@@ -0,0 +1,3 @@
+{
+  "extends": "eslint-config-discourse"
+}

.github/workflows/discourse-plugin.yml

@@ -0,0 +1,13 @@
+name: Discourse Plugin
+
+on:
+  push:
+    branches:
+      - main
+  pull_request:
+  schedule:
+    - cron: "0 0 * * *"
+
+jobs:
+  ci:
+    uses: discourse/.github/.github/workflows/discourse-plugin.yml@v1

.gitignore

@@ -1 +1,4 @@
-gems
+.idea
+node_modules
+/gems
+/autogenerated

.prettierrc

@@ -0,0 +1 @@
+{}

Gemfile

@@ -0,0 +1,8 @@
+# frozen_string_literal: true
+
+source "https://rubygems.org"
+
+group :development do
+  gem "rubocop-discourse"
+  gem "syntax_tree"
+end

Gemfile.lock

@@ -0,0 +1,55 @@
+GEM
+  remote: https://rubygems.org/
+  specs:
+    ast (2.4.2)
+    base64 (0.1.1)
+    json (2.6.3)
+    language_server-protocol (3.17.0.3)
+    parallel (1.23.0)
+    parser (3.2.2.3)
+      ast (~> 2.4.1)
+      racc
+    prettier_print (1.2.1)
+    racc (1.7.1)
+    rainbow (3.1.1)
+    regexp_parser (2.8.1)
+    rexml (3.2.6)
+    rubocop (1.56.3)
+      base64 (~> 0.1.1)
+      json (~> 2.3)
+      language_server-protocol (>= 3.17.0)
+      parallel (~> 1.10)
+      parser (>= 3.2.2.3)
+      rainbow (>= 2.2.2, < 4.0)
+      regexp_parser (>= 1.8, < 3.0)
+      rexml (>= 3.2.5, < 4.0)
+      rubocop-ast (>= 1.28.1, < 2.0)
+      ruby-progressbar (~> 1.7)
+      unicode-display_width (>= 2.4.0, < 3.0)
+    rubocop-ast (1.29.0)
+      parser (>= 3.2.1.0)
+    rubocop-capybara (2.19.0)
+      rubocop (~> 1.41)
+    rubocop-discourse (3.4.0)
+      rubocop (>= 1.1.0)
+      rubocop-rspec (>= 2.0.0)
+    rubocop-factory_bot (2.24.0)
+      rubocop (~> 1.33)
+    rubocop-rspec (2.24.0)
+      rubocop (~> 1.33)
+      rubocop-capybara (~> 2.17)
+      rubocop-factory_bot (~> 2.22)
+    ruby-progressbar (1.13.0)
+    syntax_tree (6.1.1)
+      prettier_print (>= 1.2.0)
+    unicode-display_width (2.4.2)
+
+PLATFORMS
+  x86_64-darwin-22
+
+DEPENDENCIES
+  rubocop-discourse
+  syntax_tree
+
+BUNDLED WITH
+   2.4.19

app/controllers/landing_pages/admin/page.rb

@@ -59,7 +59,8 @@ def upload
     if importer.report[:errors].any?
       render json: failed_json.merge(errors: importer.report[:errors])
     else
-      render json: success_json.merge(page: serialize_page(page))
+      page = LandingPages::Page.find_by("name", importer.report[:imported][:pages][0])
+      render json: success_json.merge(page: serialize_page(page), pages: serialzed_pages)
     end
   end
 

app/controllers/landing_pages/landing.rb

@@ -27,6 +27,7 @@ def show
     if @page.present?
       @page_title = SiteSetting.title + " | #{@page.name}"
       @classes = @page.name.parameterize
+      @theme_id = @page.theme_id
 
       if @global.present?
         @scripts = @global.scripts if @global.scripts.present?

app/views/layouts/landing.html.erb

@@ -5,8 +5,8 @@
     <title><%= @page_title %></title>
     <%= yield :head %>
     <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, user-scalable=yes, viewport-fit=cover">
-    <%- if theme_id.present? %>
-      <meta name="discourse_theme_id" content="<%= theme_id %>">
+    <%- if @theme_id.present? %>
+      <meta name="discourse_theme_id" content="<%= @theme_id %>">
     <%- end %>
     <meta name="theme-color" content="#<%= ColorScheme.hex_for_name('header_background', scheme_id) %>">
 
@@ -23,8 +23,12 @@
     <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js" defer="defer"></script>
     <%= discourse_stylesheet_link_tag "landing_page", theme_id: nil %>
 
-    <%- if theme_id.present? %>
-      <%= discourse_stylesheet_link_tag (mobile_view? ? :mobile_theme : :desktop_theme), theme_id: theme_id %>
+    <%- if @theme_id.present? %>
+      <%= discourse_color_scheme_stylesheets %>
+      <%- if @theme_id == 1 %>
+        <%= discourse_stylesheet_link_tag (mobile_view? ? :mobile : :desktop) %>
+      <%- end %>
+      <%= discourse_stylesheet_link_tag (mobile_view? ? :mobile_theme : :desktop_theme), theme_id: @theme_id %>
       <%= theme_lookup("head_tag") %>
     <%- end %>
   </head>
@@ -34,7 +38,7 @@
         <script src="<%= script %>"></script>
       <% end %>
     <% end %>
-    <%- if theme_id.present? %>
+    <%- if @theme_id.present? %>
       <%= theme_lookup("header") %>
     <%- end %>
     <% if @header %>
@@ -44,7 +48,7 @@
     <% if @footer %>
       <%= render partial: "footer", locals: @footer %>
     <% end %>
-    <%- if theme_id.present? %>
+    <%- if @theme_id.present? %>
       <%= theme_lookup("body_tag") %>
     <%- end %>
     <%= javascript_include_tag "/plugins/discourse-landing-pages/javascripts/common.js", defer: "defer", type: "application/javascript" %>

assets/javascripts/discourse/components/modal/import-pages.hbs

@@ -0,0 +1,22 @@
+<DModal
+  class="upload-selector import-pages"
+  @title={{i18n "admin.landing_pages.import.title"}}
+  @closeModal={{@closeModal}}
+>
+  <:body>
+    <div class="inputs">
+      <input onchange={{action "uploadFile"}} type="file" id="file-input" accept=".zip,application/zip"><br>
+      <span class="description">{{i18n "admin.landing_pages.import.file_tip"}}</span>
+    </div>
+  </:body>
+
+  <:footer>
+    <DButton
+      @action={{this.importPage}}
+      @disabled={{this.importDisabled}}
+      class="btn btn-primary"
+      @label="admin.landing_pages.import.button"
+    />
+    <DModalCancel @close={{@closeModal}} />
+  </:footer>
+</DModal>

assets/javascripts/discourse/components/modal/import-pages.js.es6

@@ -0,0 +1,33 @@
+import Component from "@ember/component";
+import LandingPage from "../../models/landing-page";
+import { popupAjaxError } from "discourse/lib/ajax-error";
+import { action } from "@ember/object";
+import bootbox from "bootbox";
+
+export default Component.extend({
+
+  @action
+  uploadFile() {
+    this.set("pageFile", $("#file-input")[0].files[0]);
+  },
+
+  @action
+  importPage() {
+    let data = new FormData();
+    data.append("page", this.pageFile);
+
+    this.set("loading", true);
+    LandingPage.import(data)
+      .then((result) => {
+        this.closeModal(result);
+      })
+      .catch(function (e) {
+        if (typeof e === "string") {
+          bootbox.alert(e);
+        } else {
+          popupAjaxError(e);
+        }
+      })
+      .finally(() => this.set("loading", false));
+  },
+});

assets/javascripts/discourse/components/page-admin.js.es6

@@ -99,7 +99,10 @@ export default Component.extend({
         .destroyPage()
         .then((result) => {
           if (result.success) {
-            this.set("page", null);
+            this.setProperties({
+              page: null,
+              pages: result.pages,
+            });
           }
         })
         .finally(() => {
@@ -108,17 +111,28 @@ export default Component.extend({
     },
 
     exportPage() {
-      this.page.exportPage().catch((error) => {
-        this.set("resultMessage", {
-          type: "error",
-          icon: "icon",
-          text: extractError(error),
-        });
+      const page = this.get("page");
+      let self = this;
 
-        setTimeout(() => {
-          self.set("resultMessage", null);
-        }, 5000);
-      });
+      page
+        .exportPage()
+        .then((file) => {
+          const link = document.createElement("a");
+          link.href = URL.createObjectURL(file);
+          link.setAttribute("download", `discourse-${page.name.toLowerCase()}.zip`);
+          link.click();
+        })
+        .catch((error) => {
+          self.set("resultMessage", {
+            type: "error",
+            icon: "times",
+            text: extractError(error),
+          });
+
+          setTimeout(() => {
+            self.set("resultMessage", null);
+          }, 5000);
+        });
     },
   },
 });

assets/javascripts/discourse/controllers/admin-plugins-landing-pages.js.es6

@@ -1,5 +1,7 @@
 import LandingPage from "../models/landing-page";
+import ImportPages from "../components/modal/import-pages";
 import Controller from "@ember/controller";
+import { inject as service } from "@ember/service";
 import discourseComputed from "discourse-common/utils/decorators";
 import { gt, not, notEmpty, or } from "@ember/object/computed";
 import { extractError } from "discourse/lib/ajax-error";
@@ -13,6 +15,8 @@ const statusIcons = {
 };
 
 export default Controller.extend({
+  modal: service(),
+
   remoteDisconnected: not("remote.connected"),
   pullDisabled: or("pullingFromRemote", "remoteDisconnected"),
   fetchingCommits: false,
@@ -135,14 +139,17 @@ export default Controller.extend({
     },
 
     importPages() {
-      const controller = showModal("import-pages");
-      controller.set("afterImport", (result) => {
-        this.setProperties({
-          page: LandingPage.create(result.page),
-          currentPage: JSON.parse(JSON.stringify(result.page)),
-          pages: result.pages,
+      this.modal.show(ImportPages)
+        .then((result) => {
+          if (result?.page) {
+            const page = LandingPage.create(result.page);
+            this.setProperties({
+              page: page,
+              currentPage: JSON.parse(JSON.stringify(page)),
+              pages: result.pages,
+            });
+          }
         });
-      });
     },
 
     updateRemote() {

assets/javascripts/discourse/models/landing-page.js.es6

@@ -40,6 +40,16 @@ const LandingPage = EmberObject.extend({
       type: "DELETE",
     }).catch(popupAjaxError);
   },
+
+  exportPage() {
+    return ajax(this.exportUrl, {
+      type: "GET",
+      dataType: "binary",
+      xhrFields: {
+        responseType: "blob",
+      },
+    });
+  },
 });
 
 LandingPage.reopenClass({
@@ -58,7 +68,7 @@ LandingPage.reopenClass({
   },
 
   import(data) {
-    return ajax(`${basePath}/import`, {
+    return ajax(`${basePath}/upload`, {
       type: "POST",
       processData: false,
       contentType: false,