move image files to local bg folder

src/ui/App.tsx

@@ -88,11 +88,11 @@ class App extends React.Component<IProps, IState> {
 
         bgLoc && this.setState({
           bgFile: bgLoc
-        })
+        }, this.forceUpdate)
       }
     } else this.setState({
       bgFile: custom_bg
-    })
+    }, this.forceUpdate)
 
     if (!cert_generated) {
       // Generate the certificate
@@ -109,15 +109,13 @@ class App extends React.Component<IProps, IState> {
         isDownloading: downloadHandler.getDownloads().filter(d => d.status !== 'finished')?.length > 0
       })
     }, 1000)
-    
-    console.log('mounting app component with background: ' + this.state.bgFile)
   }
 
   render() {
     return (
       <div className="App" style={
         this.state.bgFile ? {
-          background: `url(${this.state.bgFile}) fixed`,
+          background: `url("${this.state.bgFile}") fixed`,
         } : {}
       }>
         <TopBar

src/ui/components/menu/Options.tsx

@@ -6,6 +6,7 @@ import './Options.css'
 import { setConfigOption, getConfig, getConfigOption } from '../../../utils/configuration'
 import Checkbox from '../common/Checkbox'
 import Divider from './Divider'
+import { invoke } from '@tauri-apps/api'
 
 interface IProps {
   closeFn: () => void;
@@ -80,8 +81,14 @@ export default class Options extends React.Component<IProps, IState> {
     })
   }
 
-  setCustomBackground(value: string) {
+  async setCustomBackground(value: string) {
     setConfigOption('customBackground', value)
+
+    // Copy the file over to the local directory
+    invoke('copy_file', {
+      path: value.replace(/\\/g, '/'),
+      newPath: await invoke('get_local_bg_path')
+    })
   }
 
   render() {