✨ Export/Import settings to and from a json file support for the UI

Cargo.toml

@@ -1,6 +1,6 @@
 [package]
 name = "websurfx"
-version = "1.18.0"
+version = "1.21.0"
 edition = "2021"
 description = "An open-source alternative to Searx that provides clean, ad-free, and organic results with incredible speed while keeping privacy and security in mind."
 repository = "https://github.com/neon-mmd/websurfx"
@@ -88,6 +88,10 @@ thesaurus = { version = "0.5.2", default-features = false, optional = true, feat
     "moby",
 ]}
 itertools = {version = "0.13.0", default-features = false}
+actix-multipart = { version = "0.7.2", default-features = false, features = [
+    "derive",
+    "tempfile",
+]}
 
 [dev-dependencies]
 rusty-hook = { version = "^0.11.2", default-features = false }

public/static/themes/simple.css

@@ -5,7 +5,8 @@
   font-weight: 200 600;
   font-stretch: 0% 200%;
   font-display: swap;
-  src: url("https://fonts.gstatic.com/s/rubik/v28/iJWKBXyIfDnIV7nErXyi0A.woff2") format('woff2');
+  src: url('https://fonts.gstatic.com/s/rubik/v28/iJWKBXyIfDnIV7nErXyi0A.woff2')
+    format('woff2');
 }
 
 * {
@@ -97,7 +98,7 @@ button {
   outline-offset: 3px;
   outline: 2px solid transparent;
   border: none;
-  transition: .1s;
+  transition: 0.1s;
   gap: 0;
   background-color: var(--color-six);
   color: var(--background-color);
@@ -107,10 +108,10 @@ button {
 }
 
 .search_bar button img {
-  position:absolute;
-  left:50%;
-  top:50%;
-  transform:translate(-50%, -50%);
+  position: absolute;
+  left: 50%;
+  top: 50%;
+  transform: translate(-50%, -50%);
 }
 
 .search_bar button:active {
@@ -253,7 +254,6 @@ button {
 
 /* styles for the footer and header */
 
-
 header {
   width: 100%;
   background: var(--background-color);
@@ -341,7 +341,7 @@ footer div {
 .results_aggregated {
   display: flex;
   flex-direction: column;
-  justify-content: space-between; 
+  justify-content: space-between;
   margin: 2rem 0;
   content-visibility: auto;
 }
@@ -714,7 +714,8 @@ footer div {
 }
 
 .settings_container .user_interface select,
-.settings_container .general select {
+.settings_container .general select,
+.settings_container .general form input {
   margin: 0.7rem 0;
   width: 20rem;
   background-color: var(--color-one);
@@ -726,6 +727,38 @@ footer div {
   text-transform: capitalize;
 }
 
+.settings_container .general form input {
+  padding: 0;
+  width: 30rem;
+  text-align: center;
+  text-transform: none;
+}
+
+.settings_container .general form input::file-selector-button {
+  content: 'Browse';
+  padding: 1rem 2rem;
+  font-size: 1.5rem;
+  background: var(--color-three);
+  color: var(--background-color);
+  border-radius: 0.5rem;
+  border: 2px solid transparent;
+  font-weight: bold;
+  transition: all 0.1s ease-out;
+  cursor: pointer;
+  box-shadow: 5px 5px;
+  outline: none;
+  translate: -1rem 0;
+}
+
+.settings_container .general form input::file-selector-button:active {
+  box-shadow: none;
+  translate: 5px 5px;
+}
+
+.settings_container .general .export_btn {
+  margin-bottom: 1rem;
+}
+
 .settings_container .user_interface option:hover,
 .settings_container .general option:hover {
   background-color: var(--color-one);
@@ -798,7 +831,7 @@ footer div {
   left: 0.4rem;
   bottom: 0.4rem;
   background-color: var(--background-color);
-  transition: .2s;
+  transition: 0.2s;
 }
 
 input:checked + .slider {
@@ -822,7 +855,7 @@ input:checked + .slider::before {
   border-radius: 50%;
 }
 
-@media screen and (width <= 1136px) {
+@media screen and (width <=1136px) {
   .hero-text-container {
     width: unset;
   }
@@ -832,7 +865,7 @@ input:checked + .slider::before {
   }
 }
 
-@media screen and (width <= 706px) {
+@media screen and (width <=706px) {
   .about-container article .logo-container svg {
     width: clamp(200px, 290px, 815px);
   }
@@ -856,7 +889,7 @@ input:checked + .slider::before {
   .features {
     grid-template-columns: 1fr;
   }
-  
+
   .feature-list {
     padding: 35px 0;
   }

src/lib.rs

@@ -110,6 +110,7 @@ pub fn run(
             .service(server::routes::search::search) // search page
             .service(router::about) // about page
             .service(router::settings) // settings page
+            .service(server::routes::export_import::download) // download page
             .default_service(web::route().to(router::not_found)) // error page
     })
     .workers(config.threads as usize)

src/models/parser_models.rs

@@ -10,7 +10,7 @@
 /// order to allow the deserializing the json back to struct in aggregate function in
 /// aggregator.rs and create a new struct out of it and then serialize it back to json and pass
 /// it to the template files.
-#[derive(Default)]
+#[derive(Default, Clone)]
 pub struct Style {
     /// It stores the parsed theme option used to set a theme for the website.
     pub theme: String,

src/models/server_models.rs

@@ -1,17 +1,15 @@
 //! This module provides the models to parse cookies and search parameters from the search
 //! engine website.
-use std::borrow::Cow;
-
-use serde::Deserialize;
 
 use super::parser_models::Style;
+use serde::{Deserialize, Serialize};
 
 /// A named struct which deserializes all the user provided search parameters and stores them.
 #[derive(Deserialize)]
 pub struct SearchParams {
     /// It stores the search parameter option `q` (or query in simple words)
     /// of the search url.
-    pub q: Option<Cow<'static, str>>,
+    pub q: Option<String>,
     /// It stores the search parameter `page` (or pageno in simple words)
     /// of the search url.
     pub page: Option<u32>,
@@ -22,26 +20,29 @@ pub struct SearchParams {
 
 /// A named struct which is used to deserialize the cookies fetched from the client side.
 #[allow(dead_code)]
-#[derive(Deserialize)]
-pub struct Cookie<'a> {
+#[derive(Deserialize, Serialize)]
+pub struct Cookie {
     /// It stores the theme name used in the website.
-    pub theme: Cow<'a, str>,
+    pub theme: String,
     /// It stores the colorscheme name used for the website theme.
-    pub colorscheme: Cow<'a, str>,
+    pub colorscheme: String,
+    /// It stores the animation name used for the website theme.
+    pub animation: Option<String>,
     /// It stores the user selected upstream search engines selected from the UI.
-    pub engines: Cow<'a, [Cow<'a, str>]>,
+    pub engines: Vec<String>,
     /// It stores the user selected safe search level from the UI.
     pub safe_search_level: u8,
 }
 
-impl<'a> Cookie<'a> {
+impl Cookie {
     /// server_models::Cookie contructor function
-    pub fn build(style: &'a Style, mut engines: Vec<Cow<'a, str>>, safe_search_level: u8) -> Self {
+    pub fn build(style: Style, mut engines: Vec<String>, safe_search_level: u8) -> Self {
         engines.sort();
         Self {
-            theme: Cow::Borrowed(&style.theme),
-            colorscheme: Cow::Borrowed(&style.colorscheme),
-            engines: Cow::Owned(engines),
+            theme: style.theme.clone(),
+            colorscheme: style.colorscheme.clone(),
+            animation: style.animation.clone(),
+            engines,
             safe_search_level,
         }
     }