Remove primary from table

web-frontend/modules/database/components/row/RowCreateModal.vue

@@ -1,7 +1,7 @@
 <template>
   <Modal ref="modal">
     <form @submit.prevent="create">
-      <h2 v-if="primary !== undefined" class="box__title">
+      <h2 class="box__title">
         {{ heading }}
       </h2>
       <Error :error="error"></Error>
@@ -62,6 +62,7 @@ import modal from '@baserow/modules/core/mixins/modal'
 import error from '@baserow/modules/core/mixins/error'
 import RowEditModalFieldsList from './RowEditModalFieldsList.vue'
 import RowEditModalHiddenFieldsSection from './RowEditModalHiddenFieldsSection.vue'
+import { getPrimaryOrFirstField } from '@baserow/modules/database/utils/field'
 
 export default {
   name: 'RowCreateModal',
@@ -75,11 +76,6 @@ export default {
       type: Object,
       required: true,
     },
-    primary: {
-      type: Object,
-      required: false,
-      default: undefined,
-    },
     primaryIsSortable: {
       type: Boolean,
       required: false,
@@ -111,11 +107,17 @@ export default {
       return this.visibleFields.concat(this.hiddenFields)
     },
     heading() {
-      const name = `field_${this.primary.id}`
+      const field = getPrimaryOrFirstField(this.visibleFields)
+
+      if (!field) {
+        return null
+      }
+
+      const name = `field_${field.id}`
       if (Object.prototype.hasOwnProperty.call(this.row, name)) {
         return this.$registry
-          .get('field', this.primary.type)
-          .toHumanReadableString(this.primary, this.row[name])
+          .get('field', field.type)
+          .toHumanReadableString(field, this.row[name])
       } else {
         return null
       }