diff --git a/db/migration/20200310181627_add_transcoding_and_player_tables.go b/db/migration/20200310181627_add_transcoding_and_player_tables.go
index 5de1422cc..744eec3bf 100644
--- a/db/migration/20200310181627_add_transcoding_and_player_tables.go
+++ b/db/migration/20200310181627_add_transcoding_and_player_tables.go
@@ -32,9 +32,13 @@ create table player
     client varchar not null, 
     ip_address varchar,
     last_seen timestamp,
-    transcoding_id varchar, -- todo foreign key 
     max_bit_rate int default 0,
-	unique (name)
+    transcoding_id varchar,
+	unique (name),
+	foreign key (transcoding_id)
+	   references transcoding(id)
+		  on update restrict 
+		  on delete restrict
 );
 `)
 	return err
diff --git a/ui/src/App.js b/ui/src/App.js
index 871a7ce7c..7a79e4770 100644
--- a/ui/src/App.js
+++ b/ui/src/App.js
@@ -6,6 +6,7 @@ import polyglotI18nProvider from 'ra-i18n-polyglot'
 import messages from './i18n'
 import { DarkTheme, Layout, Login } from './layout'
 import transcoding from './transcoding'
+import player from './player'
 import user from './user'
 import song from './song'
 import album from './album'
@@ -48,6 +49,13 @@ const App = () => {
         permissions === 'admin' ? (
           <Resource name="user" {...user} options={{ subMenu: 'settings' }} />
         ) : null,
+        permissions === 'admin' ? (
+          <Resource
+            name="player"
+            {...player}
+            options={{ subMenu: 'settings' }}
+          />
+        ) : null,
         permissions === 'admin' ? (
           <Resource
             name="transcoding"
diff --git a/ui/src/player/PlayerEdit.js b/ui/src/player/PlayerEdit.js
new file mode 100644
index 000000000..89b208998
--- /dev/null
+++ b/ui/src/player/PlayerEdit.js
@@ -0,0 +1,52 @@
+import React from 'react'
+import {
+  TextInput,
+  TextField,
+  Edit,
+  required,
+  SimpleForm,
+  SelectInput,
+  ReferenceInput
+} from 'react-admin'
+import { Title } from '../common'
+
+const PlayerTitle = ({ record }) => {
+  return <Title subTitle={`Player ${record ? record.name : ''}`} />
+}
+
+const PlayerEdit = (props) => (
+  <Edit title={<PlayerTitle />} {...props}>
+    <SimpleForm>
+      <TextInput source="name" validate={[required()]} />
+      <ReferenceInput
+        label="Transcoding"
+        source="transcodingId"
+        reference="transcoding"
+        sort={{ field: 'name', order: 'ASC' }}
+      >
+        <SelectInput source="name" resettable />
+      </ReferenceInput>
+      <SelectInput
+        source="maxBitRate"
+        choices={[
+          { id: 32, name: '32' },
+          { id: 48, name: '48' },
+          { id: 64, name: '64' },
+          { id: 80, name: '80' },
+          { id: 96, name: '96' },
+          { id: 112, name: '112' },
+          { id: 128, name: '128' },
+          { id: 160, name: '160' },
+          { id: 192, name: '192' },
+          { id: 256, name: '256' },
+          { id: 320, name: '320' },
+          { id: 0, name: 'Unlimited' }
+        ]}
+      />
+      <TextField source="client" />
+      <TextField source="userName" />
+    </SimpleForm>
+  </Edit>
+)
+
+export default PlayerEdit
diff --git a/ui/src/player/PlayerList.js b/ui/src/player/PlayerList.js
new file mode 100644
index 000000000..3213e5a34
--- /dev/null
+++ b/ui/src/player/PlayerList.js
@@ -0,0 +1,33 @@
+import React from 'react'
+import {
+  Datagrid,
+  List,
+  TextField,
+  DateField,
+  FunctionField,
+  ReferenceField
+} from 'react-admin'
+import { Title } from '../common'
+
+const PlayerList = (props) => (
+  <List title={<Title subTitle={'Players'} />} exporter={false} {...props}>
+    <Datagrid rowClick="edit">
+      <TextField source="name" />
+      <ReferenceField
+        label="Transcoding"
+        source="transcodingId"
+        reference="transcoding"
+      >
+        <TextField source="name" />
+      </ReferenceField>
+      <FunctionField
+        label="MaxBitRate"
+        source="maxBitRate"
+        render={(r) => (r.maxBitRate ? r.maxBitRate : 'Unlimited')}
+      />
+      <DateField source="lastSeen" showTime />
+    </Datagrid>
+  </List>
+)
+
+export default PlayerList
diff --git a/ui/src/player/index.js b/ui/src/player/index.js
new file mode 100644
index 000000000..8bd817a0b
--- /dev/null
+++ b/ui/src/player/index.js
@@ -0,0 +1,9 @@
+import RadioIcon from '@material-ui/icons/Radio'
+import PlayerList from './PlayerList'
+import PlayerEdit from './PlayerEdit'
+
+export default {
+  list: PlayerList,
+  edit: PlayerEdit,
+  icon: RadioIcon
+}