wip

backend/database/seeders/PardusAppSeeder.php

@@ -39,7 +39,7 @@ class PardusAppSeeder extends Seeder
             'name' => 'Gimp',
             'image_url' => "https://upload.wikimedia.org/wikipedia/commons/4/45/The_GIMP_icon_-_gnome.svg",
             'scripts' => [
-                "sudo add-apt-repository ppa:otto-kesselgulasch/gimp -y", "sudo apt-get update -y", "sudo apt-get install gimp -y",
+                "sudo apt-get install gimp -y",
             ]
         ]);
 

desktop-client/package.json

@@ -21,6 +21,7 @@
   "dependencies": {
     "axios": "^0.21.1",
     "core-js": "^3.6.5",
+    "sudo-prompt": "^9.2.1",
     "vue": "^3.0.0",
     "vue-router": "^4.0.0-0"
   },

desktop-client/preload.js

-const electron = require("electron");
-window.ipcRenderer = electron.ipcRenderer;
+import { ipcRenderer } from "electron";
+window.ipcRenderer = ipcRenderer;
+console.log("here");

desktop-client/src/App.vue

 <template>
   <div
-    v-if="loading"
+    v-if="installationOpen"
+    class="bg-gray-900 h-screen flex items-center justify-center"
+  >
+    <Installation @close="onInstallationEnd" />
+  </div>
+  <div
+    v-else-if="loading"
     class="bg-gray-900 h-screen flex items-center justify-center"
   >
     <Loading loading-message="Uygulama Listesi Yükleniyor" />
@@ -16,13 +22,24 @@
 import Sidebar from "./components/Sidebar";
 import store from "./global-state/store";
 import Loading from "./components/Loader";
+import { ref } from "vue";
+import Installation from "./views/Installation";
 export default {
-  components: { Loading, Sidebar },
+  components: { Installation, Loading, Sidebar },
   setup() {
     store.fetchData().then(() => {
       store.loading.value = false;
     });
-    return { loading: store.loading };
+
+    const installationOpen = ref(false);
+    window.ipcRenderer.on("installation-start", () => {
+      installationOpen.value = true;
+    });
+    function onInstallationEnd() {
+      installationOpen.value = false;
+    }
+
+    return { loading: store.loading, installationOpen, onInstallationEnd };
   },
 };
 </script>

desktop-client/src/actions/install.js

+import store from "../global-state/store";
+
+function generateInstallationScriptFromBucket() {
+  return store.bucket.value.map((appId) => {
+    const pardusApp = store.pardusApps.value.find((app) => app.id === appId);
+    const { id } = pardusApp;
+    const scripts = pardusApp.scripts.map((script) =>
+      script.replace("sudo", "")
+    );
+    scripts.push(
+      'find /etc/apt/sources.list.d/ -name "*.save" -type f -delete'
+    );
+    const cmd = scripts.join(";");
+    return { id, cmd };
+  });
+}
+
+function install() {
+  // console.log(generateInstallationScriptFromBucket());
+  window.ipcRenderer.send("install", generateInstallationScriptFromBucket());
+}
+
+export default { generateInstallationScriptFromBucket, install };

desktop-client/src/background.js

@@ -4,6 +4,9 @@ import { app, protocol, BrowserWindow, ipcMain } from "electron";
 import { createProtocol } from "vue-cli-plugin-electron-builder/lib";
 import installExtension, { VUEJS_DEVTOOLS } from "electron-devtools-installer";
 import exportToFileListener from "./electron-listeners/exportToFileListener";
+import installListener from "./electron-listeners/installListener";
+
+console.log({ __dirname });
 const isDevelopment = process.env.NODE_ENV !== "production";
 const path = require("path");
 // Scheme must be registered before the app is ready
@@ -21,9 +24,10 @@ async function createWindow() {
       // Use pluginOptions.nodeIntegration, leave this alone
       // See nklayman.github.io/vue-cli-plugin-electron-builder/guide/security.html#node-integration for more info
       nodeIntegration: process.env.ELECTRON_NODE_INTEGRATION,
-      preload: path.join(__dirname, "../preload.js"),
+      preload: path.join(__dirname, "preload.js"),
     },
   });
+
   win.maximize();
   win.show();
 
@@ -67,6 +71,7 @@ app.on("ready", async () => {
   }
   createWindow();
   ipcMain.on("exportBucket", exportToFileListener);
+  ipcMain.on("install", installListener);
 });
 
 // Exit cleanly on request from parent process in development mode.

desktop-client/src/components/Bucket.vue

@@ -17,6 +17,12 @@
         </button>
       </div>
     </div>
+    <button
+      class="bg-pardus-yellow px-4 py-2 text-sm text-gray-900 font-medium rounded-md shadow-md w-full mt-4"
+      @click="install"
+    >
+      Kurulumu Gerçekleştir
+    </button>
     <button
       class="bg-pardus-yellow px-4 py-2 text-sm text-gray-900 font-medium rounded-md shadow-md w-full mt-4"
       @click="exportToFile"
@@ -31,6 +37,7 @@ import IconCross from "../icons/icon-cross.svg";
 import store from "../global-state/store";
 import { computed } from "vue";
 import exportToFile from "../actions/exportToFile";
+import install from "../actions/install";
 export default {
   name: "Bucket",
   components: { IconCross },
@@ -45,6 +52,7 @@ export default {
       apps,
       bucket: store.bucket,
       removeFromBucket,
+      install: install.install,
       exportToFile: exportToFile.exportToFile,
     };
   },

desktop-client/src/electron-listeners/installListener.js

+const path = require("path");
+const fs = require("fs");
+const { BrowserWindow, app } = require("electron");
+const sudo = require("sudo-prompt");
+const { exec } = require("child_process");
+// let state;
+
+const basePath = path.join(app.getPath("appData"), "tmp", "program");
+const baseCheckPath = path.join(basePath, "check");
+const getShellPath = (id) => path.join(basePath, id + ".txt");
+const getCheckPath = (id) => path.join(baseCheckPath, id + ".txt");
+
+export default function installListener(event, data) {
+  const window = BrowserWindow.getFocusedWindow();
+  window.webContents.send("open-installation-screen");
+  clearTmp();
+  // state = {};
+  const watcherInterval = setInterval(() => watcher(window), 100);
+  const command =
+    "apt update -y; apt install -y software-properties-common;" +
+    data
+      .map((app) => {
+        const checkPath = getCheckPath(app.id);
+        const shellPath = getShellPath(app.id);
+        console.log({ checkPath, shellPath });
+        return `cat /dev/null > ${checkPath}; 
+      echo 'in-progress' > ${checkPath};
+      cat /dev/null > ${shellPath};  
+      echo '${app.cmd}' > ${shellPath}; 
+      sh ${shellPath};
+      echo 'end' > ${checkPath};`;
+      })
+      .join("");
+  window.webContents.send("installation-start");
+  sudo.exec(command, { name: "Pardus Kataliz" }, (err, stdout, stderr) => {
+    if (err) {
+      console.log(err);
+      window.webContents.send("installation-error", { err });
+      return;
+    }
+    setTimeout(() => {
+      clearInterval(watcherInterval);
+      watcher(window);
+      console.log({ stdout, stderr });
+      // window.webContents.send("installation-stdout", { stdout });
+      // window.webContents.send("installation-stderr", { stderr });
+      window.webContents.send("installation-end");
+    }, 120);
+  });
+}
+
+function clearTmp() {
+  exec("rm -rf " + basePath, function () {
+    mkdirF(basePath);
+    mkdirF(baseCheckPath);
+  });
+}
+
+function mkdirF(dir) {
+  if (fs.existsSync(dir)) return true;
+  const dirname = path.dirname(dir);
+  mkdirF(dirname);
+  fs.mkdirSync(dir);
+}
+
+function watcher(window) {
+  fs.readdirSync(baseCheckPath).forEach((file) => {
+    const id = file.replace(".txt", "");
+    const status = fs.readFileSync(getCheckPath(id)).toString().trim();
+    // if (typeof state[id] === "undefined" || state[id] !== status) {
+    //   state[id] = status;
+    window.webContents.send("installation-update", { id, status });
+    // }
+  });
+}

desktop-client/src/router/index.js

-import { createRouter, createWebHistory } from "vue-router";
+import {
+  createRouter,
+  createWebHashHistory,
+  createWebHistory,
+} from "vue-router";
 import AlternativeApps from "../views/AlternativeApps";
 import AppPackages from "../views/AppPackages";
 
@@ -16,7 +20,9 @@ const routes = [
 ];
 
 const router = createRouter({
-  history: createWebHistory(process.env.BASE_URL),
+  history: process.env.IS_ELECTRON
+    ? createWebHashHistory()
+    : createWebHistory(),
   routes,
 });
 

desktop-client/src/views/Installation.vue

+<template>
+  <div
+    class="w-full h-full px-8 py-8 text-gray-100 flex justify-center items-center flex-col bg-gray-800"
+  >
+    <h2 class="text-2xl font-bold text-pardus-yellow mb-4">
+      Kurulumlar Gerçekleştiriliyor.
+    </h2>
+    <IconPardusLogo class="w-48 h-48 animate-pulse mb-16" />
+    <div class="space-y-4 mb-16">
+      <div
+        class="rounded-lg bg-gray-900 shadow-lg px-6 flex items-center py-4 font-medium space-x-8"
+        v-for="(item, key) in installationState"
+        :key="key"
+      >
+        <div class="inline-block w-64 border-r border-gray-300">
+          {{ item.name }}
+        </div>
+        <div class="inline-block">{{ item.status }}</div>
+      </div>
+    </div>
+    <div v-if="isEnd" class="text-center">
+      <div class="font-medium text-lg">Kurulumlar tamamlandı!</div>
+      <button
+        class="mx-auto mt-4 inline-block px-8 py-3 bg-pardus-yellow text-black rounded-lg shadow-lg"
+        @click="$emit('close')"
+      >
+        Uygulamaya Dön
+      </button>
+    </div>
+    <div class="font-medium text-lg" v-else>
+      Lütfen kurulumların tamamlanmasını bekleyiniz.
+    </div>
+  </div>
+</template>
+
+<script>
+import store from "../global-state/store";
+import { reactive, ref } from "vue";
+import IconPardusLogo from "../icons/icon-pardus-logo.svg";
+
+export default {
+  name: "Installation",
+  components: { IconPardusLogo },
+  setup() {
+    const isEnd = ref(false);
+    const installationState = reactive({});
+    store.bucket.value.forEach((appId) => {
+      const app = store.pardusApps.value.find((app) => app.id === appId);
+      installationState[app.id] = {
+        name: app.name,
+        status: "Diğer kurulumlar bekleniyor.",
+      };
+    });
+
+    window.ipcRenderer.on("installation-update", (event, data) => {
+      console.log({ data });
+      if (data.status === "end") {
+        installationState[data.id].status = "Kurulum tamamlandı.";
+      } else if (data.status === "in-progress") {
+        installationState[data.id].status = "Kuruluyor.";
+      }
+    });
+
+    window.ipcRenderer.on("installation-end", () => (isEnd.value = true));
+
+    return { installationState, isEnd };
+  },
+};
+</script>
+
+<style scoped></style>

desktop-client/vue.config.js

 module.exports = {
   pluginOptions: {
     electronBuilder: {
+      preload: "preload.js",
       builderOptions: {
         linux: {
           publish: ["github"],

desktop-client/yarn.lock

@@ -9271,6 +9271,11 @@ stylehacks@^4.0.0:
     postcss "^7.0.0"
     postcss-selector-parser "^3.0.0"
 
+sudo-prompt@^9.2.1:
+  version "9.2.1"
+  resolved "https://registry.yarnpkg.com/sudo-prompt/-/sudo-prompt-9.2.1.tgz#77efb84309c9ca489527a4e749f287e6bdd52afd"
+  integrity sha512-Mu7R0g4ig9TUuGSxJavny5Rv0egCEtpZRNMrZaYS1vxkiIxGiGUwoezU3LazIQ+KE04hTrTfNPgxU5gzi7F5Pw==
+
 sumchecker@^3.0.1:
   version "3.0.1"
   resolved "https://registry.yarnpkg.com/sumchecker/-/sumchecker-3.0.1.tgz#6377e996795abb0b6d348e9b3e1dfb24345a8e42"