Merge branch 'more-customizable-notices' into 'master'

More customizable notices

See merge request timvisee/send!36

app/main.css

@@ -167,6 +167,10 @@ footer li a:hover {
   width: auto;
 }
 
+.text-underline {
+  text-decoration: underline;
+}
+
 .main {
   display: flex;
   position: relative;

app/ui/archiveTile.js

@@ -486,12 +486,12 @@ module.exports.empty = function(state, emit) {
             })}
           </button>
         `;
-  const warning = state.WEB_UI.UPLOAD_AREA_WARNING_HTML
+  const uploadNotice = state.WEB_UI.UPLOAD_AREA_NOTICE_HTML
     ? html`
         <p
           class="w-full mt-8 p-2 border-default dark:border-grey-70 rounded-default text-orange-60 bg-yellow-40 text-center leading-normal"
         >
-          ${raw(state.WEB_UI.UPLOAD_AREA_WARNING_HTML)}
+          ${raw(state.WEB_UI.UPLOAD_AREA_NOTICE_HTML)}
         </p>
       `
     : '';
@@ -536,7 +536,7 @@ module.exports.empty = function(state, emit) {
       >
         ${state.translate('addFilesButton')}
       </label>
-      ${upsell} ${warning}
+      ${upsell} ${uploadNotice}
     </send-upload-area>
   `;
 
@@ -569,12 +569,12 @@ module.exports.preview = function(state, emit) {
           ${archiveDetails(state.translate, archive)}
         </div>
       `;
-  const warning = state.WEB_UI.DOWNLOAD_WARNING_HTML
+  const notice = state.WEB_UI.DOWNLOAD_NOTICE_HTML
     ? html`
         <p
           class="w-full mt-4 p-2 border-default dark:border-grey-70 rounded-default text-orange-60 bg-yellow-40 text-center leading-normal"
         >
-          ${raw(state.WEB_UI.DOWNLOAD_WARNING_HTML)}
+          ${raw(state.WEB_UI.DOWNLOAD_NOTICE_HTML)}
         </p>
       `
     : '';
@@ -594,7 +594,7 @@ module.exports.preview = function(state, emit) {
       >
         ${state.translate('downloadButtonLabel')}
       </button>
-      ${warning}
+      ${notice}
     </send-archive>
   `;
 

app/ui/home.js

@@ -1,4 +1,5 @@
 const html = require('choo/html');
+const raw = require('choo/html/raw');
 const { list } = require('../utils');
 const archiveTile = require('./archiveTile');
 const modal = require('./modal');
@@ -16,7 +17,19 @@ module.exports = function(state, emit) {
   } else {
     left = archiveTile.empty(state, emit);
   }
+
+  if (archives.length > 0 && state.WEB_UI.UPLOADS_LIST_NOTICE_HTML) {
+    archives.push(html`
+      <p
+        class="w-full p-2 border-default dark:border-grey-70 rounded-default text-orange-60 bg-yellow-40 text-center leading-normal"
+      >
+        ${raw(state.WEB_UI.UPLOADS_LIST_NOTICE_HTML)}
+      </p>
+    `);
+  }
+
   archives.reverse();
+
   const right =
     archives.length === 0
       ? intro(state)

app/ui/intro.js

@@ -1,6 +1,17 @@
 const html = require('choo/html');
+const raw = require('choo/html/raw');
 
 module.exports = function intro(state) {
+  const notice = state.WEB_UI.MAIN_NOTICE_HTML
+    ? html`
+        <p
+          class="w-full mt-8 p-2 border-default dark:border-grey-70 rounded-default text-orange-60 bg-yellow-40 text-center leading-normal"
+        >
+          ${raw(state.WEB_UI.MAIN_NOTICE_HTML)}
+        </p>
+      `
+    : '';
+
   return html`
     <send-intro
       class="flex flex-col items-center justify-center bg-white px-6 md:py-0 py-6 mb-0 h-full w-full dark:bg-grey-90"
@@ -12,6 +23,7 @@ module.exports = function intro(state) {
         <p class="max-w-sm leading-loose mt-6 md:mt-2 md:pr-14">
           ${state.translate('introDescription')}
         </p>
+        ${notice}
       </div>
     </send-intro>
   `;

server/clientConstants.js

@@ -15,8 +15,10 @@ module.exports = {
     FOOTER_SOURCE_URL: config.footer_source_url,
     CUSTOM_FOOTER_TEXT: config.custom_footer_text,
     CUSTOM_FOOTER_URL: config.custom_footer_url,
-    UPLOAD_AREA_WARNING_HTML: config.upload_area_warning_html,
+    MAIN_NOTICE_HTML: config.main_notice_html,
-    DOWNLOAD_WARNING_HTML: config.download_warning_html,
+    UPLOAD_AREA_NOTICE_HTML: config.upload_area_notice_html,
+    UPLOADS_LIST_NOTICE_HTML: config.uploads_list_notice_html,
+    DOWNLOAD_NOTICE_HTML: config.download_notice_html,
     COLORS: {
       PRIMARY: config.ui_color_primary,
       ACCENT: config.ui_color_accent

server/config.js

@@ -264,15 +264,25 @@ const conf = convict({
     default: '',
     env: 'CUSTOM_FOOTER_URL'
   },
-  upload_area_warning_html: {
+  main_notice_html: {
     format: String,
     default: '',
-    env: 'SEND_UPLOAD_AREA_WARNING_HTML'
+    env: 'SEND_MAIN_NOTICE_HTML'
   },
-  download_warning_html: {
+  upload_area_notice_html: {
     format: String,
     default: '',
-    env: 'SEND_DOWNLOAD_WARNING_HTML'
+    env: 'SEND_UPLOAD_AREA_NOTICE_HTML'
+  },
+  uploads_list_notice_html: {
+    format: String,
+    default: '',
+    env: 'SEND_UPLOADS_LIST_NOTICE_HTML'
+  },
+  download_notice_html: {
+    format: String,
+    default: '',
+    env: 'SEND_DOWNLOAD_NOTICE_HTML'
   },
   ui_color_primary: {
     format: String,