Add flag to disable Scrobble config in the UI

conf/configuration.go

@@ -69,6 +69,7 @@ type configOptions struct {
 	DevOldCacheLayout          bool
 	DevActivityPanel           bool
 	DevEnableShare             bool
+	DevEnableScrobble          bool
 }
 
 type scannerOptions struct {
@@ -227,6 +228,7 @@ func init() {
 	viper.SetDefault("devFastAccessCoverArt", false)
 	viper.SetDefault("devactivitypanel", true)
 	viper.SetDefault("devenableshare", false)
+	viper.SetDefault("devenablescrobble", false)
 }
 
 func InitConfig(cfgFile string) {

server/serve_index.go

@@ -44,6 +44,7 @@ func serveIndex(ds model.DataStore, fs fs.FS) http.HandlerFunc {
 			"devFastAccessCoverArt":   conf.Server.DevFastAccessCoverArt,
 			"enableUserEditing":       conf.Server.EnableUserEditing,
 			"devEnableShare":          conf.Server.DevEnableShare,
+			"devEnableScrobble":       conf.Server.DevEnableScrobble,
 		}
 		auth := handleLoginFromHeaders(ds, r)
 		if auth != nil {

server/serve_index_test.go

@@ -199,6 +199,16 @@ var _ = Describe("serveIndex", func() {
 		config := extractAppConfig(w.Body.String())
 		Expect(config).To(HaveKeyWithValue("devEnableShare", false))
 	})
+
+	It("sets the devEnableScrobble", func() {
+		r := httptest.NewRequest("GET", "/index.html", nil)
+		w := httptest.NewRecorder()
+
+		serveIndex(ds, fs)(w, r)
+
+		config := extractAppConfig(w.Body.String())
+		Expect(config).To(HaveKeyWithValue("devEnableScrobble", false))
+	})
 })
 
 var appConfigRegex = regexp.MustCompile(`(?m)window.__APP_CONFIG__="([^"]*)`)

ui/src/config.js

@@ -19,6 +19,7 @@ const defaultConfig = {
   defaultTheme: 'Dark',
   enableUserEditing: true,
   devEnableShare: true,
+  devEnableScrobble: true,
 }
 
 let config

ui/src/personal/Personal.js

@@ -5,6 +5,8 @@ import { SelectLanguage } from './SelectLanguage'
 import { SelectTheme } from './SelectTheme'
 import { SelectDefaultView } from './SelectDefaultView'
 import { NotificationsToggle } from './NotificationsToggle'
+import { ScrobbleToggle } from './ScrobbleToggle'
+import config from '../config'
 
 const useStyles = makeStyles({
   root: { marginTop: '1em' },
@@ -22,6 +24,7 @@ const Personal = () => {
         <SelectLanguage />
         <SelectDefaultView />
         <NotificationsToggle />
+        {config.devEnableScrobble && <ScrobbleToggle />}
       </SimpleForm>
     </Card>
   )

ui/src/personal/ScrobbleToggle.js

@@ -0,0 +1,43 @@
+import { useNotify, useTranslate } from 'react-admin'
+import { useDispatch, useSelector } from 'react-redux'
+import { setNotificationsState } from '../actions'
+import {
+  FormControl,
+  FormControlLabel,
+  LinearProgress,
+  Switch,
+} from '@material-ui/core'
+import { useState } from 'react'
+import { openInNewTab } from '../utils'
+
+export const ScrobbleToggle = (props) => {
+  const translate = useTranslate()
+  const [linked, setLinked] = useState(false)
+
+  const toggleScrobble = (event) => {
+    if (!linked) {
+      openInNewTab(
+        'https://www.last.fm/api/auth/?api_key=c2918986bf01b6ba353c0bc1bdd27bea'
+      )
+    }
+    setLinked(!linked)
+  }
+
+  return (
+    <FormControl>
+      <FormControlLabel
+        control={
+          <Switch
+            id={'notifications'}
+            color="primary"
+            checked={linked}
+            disabled={linked}
+            onChange={toggleScrobble}
+          />
+        }
+        label={<span>{translate('Scrobble to Last.FM')}</span>}
+      />
+      {linked && <LinearProgress />}
+    </FormControl>
+  )
+}