From cf1ee31f90a61bbaae0807aac38c889fdf612b72 Mon Sep 17 00:00:00 2001
From: James Chang <jc4095@nyu.edu>
Date: Mon, 19 Apr 2021 21:35:07 -0400
Subject: [PATCH] Add event and pb type presets on my-pbs page

---
 .../interface/crud/crudRecordInterface.vue    |   4 +
 .../special/crudPersonalBestInterface.vue     |   7 +-
 .../crud/viewRecordTableInterface.vue         |   1 +
 frontend/components/menu/recordActionMenu.vue |  31 ++-
 .../components/page/preset/pbPagePreset.vue   | 247 ++++++++++++++++++
 frontend/mixins/crud.js                       |  10 +-
 frontend/mixins/editRecordInterface.js        |  51 ++--
 frontend/models/special/publicPbs.ts          |   2 +-
 frontend/pages/my-pbs.vue                     |  21 +-
 frontend/pages/public-pbs.vue                 | 220 +---------------
 frontend/types/index.ts                       |   9 +-
 11 files changed, 340 insertions(+), 263 deletions(-)
 create mode 100644 frontend/components/page/preset/pbPagePreset.vue

diff --git a/frontend/components/interface/crud/crudRecordInterface.vue b/frontend/components/interface/crud/crudRecordInterface.vue
index c844233..33fddb0 100644
--- a/frontend/components/interface/crud/crudRecordInterface.vue
+++ b/frontend/components/interface/crud/crudRecordInterface.vue
@@ -246,6 +246,7 @@
                 offset-y
                 @handle-action-click="openEditDialog"
                 @handle-expand-click="openExpandDialog(props, ...$event)"
+                @handle-custom-action-click="handleCustomActionClick"
               >
                 <template v-slot:activator="{ on, attrs }">
                   <v-btn block text v-bind="attrs" v-on="on"> Actions </v-btn>
@@ -262,6 +263,7 @@
                   v-if="headerItem.fieldInfo.component"
                   :item="props.item"
                   :field-path="headerItem.path"
+                  @submit="reset({ resetExpanded: false })"
                 ></component>
                 <span v-else>
                   {{ getTableRowData(headerItem, props.item) }}
@@ -293,6 +295,7 @@
                 offset-x
                 @handle-action-click="openEditDialog"
                 @handle-expand-click="toggleItemExpanded(props, ...$event)"
+                @handle-custom-action-click="handleCustomActionClick"
               >
                 <template v-slot:activator="{ on, attrs }">
                   <v-icon small v-bind="attrs" v-on="on"
@@ -307,6 +310,7 @@
                 v-if="headerItem.fieldInfo.component"
                 :item="props.item"
                 :field-path="headerItem.path"
+                @submit="reset({ resetExpanded: false })"
               ></component>
               <span v-else>
                 {{ getTableRowData(headerItem, props.item) }}
diff --git a/frontend/components/interface/crud/special/crudPersonalBestInterface.vue b/frontend/components/interface/crud/special/crudPersonalBestInterface.vue
index c115e14..138648b 100644
--- a/frontend/components/interface/crud/special/crudPersonalBestInterface.vue
+++ b/frontend/components/interface/crud/special/crudPersonalBestInterface.vue
@@ -246,6 +246,7 @@
                 offset-y
                 @handle-action-click="openEditDialog"
                 @handle-expand-click="openExpandDialog(props, ...$event)"
+                @handle-custom-action-click="handleCustomActionClick"
               >
                 <template v-slot:activator="{ on, attrs }">
                   <v-btn block text v-bind="attrs" v-on="on"> Actions </v-btn>
@@ -266,6 +267,7 @@
                     v-if="headerItem.fieldInfo.component"
                     :item="props.item"
                     :field-path="headerItem.path"
+                    @submit="reset({ resetExpanded: false })"
                   ></component>
                   <span v-else>
                     {{ getTableRowData(headerItem, props.item) }}
@@ -293,11 +295,12 @@
               <RecordActionMenu
                 :record-info="recordInfo"
                 :item="props.item"
+                expand-mode="emit"
                 left
                 offset-x
-                expand-mode="emit"
                 @handle-action-click="openEditDialog"
                 @handle-expand-click="toggleItemExpanded(props, ...$event)"
+                @handle-custom-action-click="handleCustomActionClick"
               >
                 <template v-slot:activator="{ on, attrs }">
                   <v-icon small v-bind="attrs" v-on="on"
@@ -309,13 +312,13 @@
             <span v-else-if="headerItem.value === 'rank'">
               {{ renderRank(props.index) }}
             </span>
-
             <span v-else>
               <component
                 :is="headerItem.fieldInfo.component"
                 v-if="headerItem.fieldInfo.component"
                 :item="props.item"
                 :field-path="headerItem.path"
+                @submit="reset({ resetExpanded: false })"
               ></component>
               <span v-else>
                 {{ getTableRowData(headerItem, props.item) }}
diff --git a/frontend/components/interface/crud/viewRecordTableInterface.vue b/frontend/components/interface/crud/viewRecordTableInterface.vue
index 7a14197..81e3115 100644
--- a/frontend/components/interface/crud/viewRecordTableInterface.vue
+++ b/frontend/components/interface/crud/viewRecordTableInterface.vue
@@ -33,6 +33,7 @@
                         ? item.fieldInfo.compoundOptions.pathPrefix
                         : item.field
                     "
+                    @submit="$emit('handleSubmit')"
                   ></component>
                   <span v-else style="white-space: break-spaces">{{
                     getNestedProperty(currentItem, item.field)
diff --git a/frontend/components/menu/recordActionMenu.vue b/frontend/components/menu/recordActionMenu.vue
index 7e972df..2ceaf53 100644
--- a/frontend/components/menu/recordActionMenu.vue
+++ b/frontend/components/menu/recordActionMenu.vue
@@ -78,18 +78,37 @@
         </v-list-item-icon>
         <v-list-item-title>Delete</v-list-item-title>
       </v-list-item>
+      <template
+        v-if="recordInfo.customActions && recordInfo.customActions.length > 0"
+      >
+        <v-divider></v-divider>
+        <v-list-item
+          v-for="(actionObject, i) in recordInfo.customActions"
+          :key="'ca' + i"
+          dense
+          @click="handleCustomActionClick(actionObject)"
+        >
+          <v-list-item-icon>
+            <v-icon>{{ actionObject.icon }}</v-icon>
+          </v-list-item-icon>
+          <v-list-item-title>{{ actionObject.text }} </v-list-item-title>
+        </v-list-item>
+      </template>
+
       <v-divider v-if="recordInfo.expandTypes.length > 0"></v-divider>
       <v-list-item
-        v-for="(item, i) in recordInfo.expandTypes"
+        v-for="(expandObject, i) in recordInfo.expandTypes"
         :key="i"
         dense
-        @click="openExpandType(item, i)"
+        @click="openExpandType(expandObject, i)"
       >
         <v-list-item-icon>
-          <v-icon>{{ item.icon || item.recordInfo.icon }}</v-icon>
+          <v-icon>{{
+            expandObject.icon || expandObject.recordInfo.icon
+          }}</v-icon>
         </v-list-item-icon>
         <v-list-item-title
-          >{{ item.name || item.recordInfo.name }}
+          >{{ expandObject.name || item.recordInfo.name }}
           <v-icon v-if="expandMode === 'openInNew'" small right
             >mdi-open-in-new</v-icon
           >
@@ -153,6 +172,10 @@ export default {
         )
     },
 
+    handleCustomActionClick(actionObject) {
+      this.$emit('handle-custom-action-click', actionObject, this.item)
+    },
+
     goToPage() {
       goToPage(
         this,
diff --git a/frontend/components/page/preset/pbPagePreset.vue b/frontend/components/page/preset/pbPagePreset.vue
new file mode 100644
index 0000000..36e59f6
--- /dev/null
+++ b/frontend/components/page/preset/pbPagePreset.vue
@@ -0,0 +1,247 @@
+<template>
+  <v-container fluid class="text-center pb-0" style="max-width: 1920px">
+    <v-progress-circular
+      v-if="loading.presets"
+      indeterminate
+    ></v-progress-circular>
+    <v-row v-else justify="center" class="pt-3">
+      <v-col :key="-1" cols="12" lg="3" class="pb-0">
+        <v-autocomplete
+          v-model="inputs.event"
+          :items="events"
+          item-text="name"
+          item-value="id"
+          label="Event"
+          filled
+          return-object
+          :clearable="eventClearable"
+          @change="applyEventPreset"
+        ></v-autocomplete>
+      </v-col>
+      <v-col :key="-2" cols="12" lg="3" class="pb-0">
+        <v-autocomplete
+          v-model="inputs.pbType"
+          :items="pbTypes"
+          item-text="text"
+          label="PB Type"
+          clearable
+          filled
+          return-object
+          @change="applyPbPreset"
+        ></v-autocomplete>
+      </v-col>
+    </v-row>
+  </v-container>
+</template>
+
+<script>
+import { getEvents } from '~/services/dropdown'
+import { generateRoute } from '~/services/base'
+
+export default {
+  props: {
+    eventClearable: {
+      type: Boolean,
+      default: true,
+    },
+  },
+
+  data() {
+    return {
+      inputs: {
+        event: null,
+        pbType: null,
+      },
+      loading: {
+        presets: false,
+      },
+      events: [],
+      pbTypes: [
+        {
+          text: 'Single',
+          attributes: {
+            'pbClass.id': 1,
+            setSize: 1,
+          },
+        },
+        {
+          text: 'Mo3',
+          attributes: {
+            'pbClass.id': 3,
+            setSize: 3,
+          },
+        },
+        {
+          text: 'Ao5',
+          attributes: {
+            'pbClass.id': 2,
+            setSize: 5,
+          },
+        },
+        {
+          text: 'Ao12',
+          attributes: {
+            'pbClass.id': 2,
+            setSize: 12,
+          },
+        },
+        {
+          text: 'Ao50',
+          attributes: {
+            'pbClass.id': 2,
+            setSize: 50,
+          },
+        },
+        {
+          text: 'Ao100',
+          attributes: {
+            'pbClass.id': 2,
+            setSize: 100,
+          },
+        },
+        {
+          text: 'Ao1000',
+          attributes: {
+            'pbClass.id': 2,
+            setSize: 1000,
+          },
+        },
+      ],
+    }
+  },
+
+  watch: {
+    '$route.query.pageOptions'() {
+      this.syncFilters()
+    },
+  },
+
+  mounted() {
+    this.loadPresets().then(() => {
+      this.syncFilters()
+    })
+  },
+
+  methods: {
+    applyEventPreset(event) {
+      // get the original sortBy/sortDesc
+      const originalPageOptions = this.$route.query.pageOptions
+        ? JSON.parse(atob(decodeURIComponent(this.$route.query.pageOptions)))
+        : null
+
+      // replace event.id filters with new ones
+      const excludeFilterKeys = ['event.id']
+
+      this.$router.push(
+        generateRoute(this.$route.path, {
+          ...originalPageOptions,
+          filters: (originalPageOptions?.filters
+            ? originalPageOptions.filters.filter(
+                (filterObject) =>
+                  !excludeFilterKeys.includes(filterObject.field)
+              )
+            : []
+          ).concat(
+            event
+              ? [
+                  {
+                    field: 'event.id',
+                    operator: 'eq',
+                    value: event.id,
+                  },
+                ]
+              : []
+          ),
+        })
+      )
+    },
+
+    applyPbPreset(pbType) {
+      // get the original sortBy/sortDesc/filters
+      const originalPageOptions = this.$route.query.pageOptions
+        ? JSON.parse(atob(decodeURIComponent(this.$route.query.pageOptions)))
+        : null
+
+      // replace event.id/setSize filters with new ones
+      const excludeFilterKeys = ['pbClass.id', 'setSize']
+
+      this.$router.push(
+        generateRoute(this.$route.path, {
+          ...originalPageOptions,
+          filters: (originalPageOptions?.filters
+            ? originalPageOptions.filters.filter(
+                (filterObject) =>
+                  !excludeFilterKeys.includes(filterObject.field)
+              )
+            : []
+          ).concat(
+            pbType
+              ? [
+                  {
+                    field: 'pbClass.id',
+                    operator: 'eq',
+                    value: pbType.attributes['pbClass.id'],
+                  },
+                  {
+                    field: 'setSize',
+                    operator: 'eq',
+                    value: pbType.attributes.setSize,
+                  },
+                ]
+              : []
+          ),
+        })
+      )
+    },
+
+    async loadPresets() {
+      this.loading.presets = true
+
+      this.events = await getEvents(this)
+
+      this.loading.presets = false
+    },
+
+    // syncs preset inputs with filters
+    syncFilters() {
+      const originalPageOptions = this.$route.query.pageOptions
+        ? JSON.parse(atob(decodeURIComponent(this.$route.query.pageOptions)))
+        : null
+
+      // determine if a preset was applied
+      if (originalPageOptions.filters) {
+        const eventFilterObject = originalPageOptions.filters.find(
+          (filterObject) => filterObject.field === 'event.id'
+        )
+
+        if (eventFilterObject) {
+          this.inputs.event = this.events.find(
+            (event) => event.id === eventFilterObject.value
+          )
+          console.log(this.inputs.event)
+        } else {
+          this.inputs.event = null
+        }
+
+        const setSizeFilterObject = originalPageOptions.filters.find(
+          (filterObject) => filterObject.field === 'setSize'
+        )
+
+        const pbClassFilterObject = originalPageOptions.filters.find(
+          (filterObject) => filterObject.field === 'pbClass.id'
+        )
+
+        if (setSizeFilterObject && pbClassFilterObject) {
+          this.inputs.pbType = this.pbTypes.find(
+            (pbType) =>
+              pbType.attributes.setSize === setSizeFilterObject.value &&
+              pbType.attributes['pbClass.id'] === pbClassFilterObject.value
+          )
+        } else {
+          this.inputs.pbType = null
+        }
+      }
+    },
+  },
+}
+</script>
diff --git a/frontend/mixins/crud.js b/frontend/mixins/crud.js
index 28579bf..2e3cc1f 100644
--- a/frontend/mixins/crud.js
+++ b/frontend/mixins/crud.js
@@ -303,12 +303,6 @@ export default {
   },
 
   created() {
-    this.$root.$on('refresh-crud-interface', () => {
-      this.reset({
-        resetExpanded: false,
-      })
-    })
-
     this.reset({
       resetSubscription: true,
       initFilters: true,
@@ -332,6 +326,10 @@ export default {
       this.updatePageOptions()
     },
 
+    handleCustomActionClick(actionObject, item) {
+      actionObject.handleClick(this, item)
+    },
+
     handleTableOptionsUpdated() {
       this.$nextTick(() => {
         switch (this.tableOptionsUpdatedTrigger) {
diff --git a/frontend/mixins/editRecordInterface.js b/frontend/mixins/editRecordInterface.js
index e4baa3f..fc88125 100644
--- a/frontend/mixins/editRecordInterface.js
+++ b/frontend/mixins/editRecordInterface.js
@@ -261,30 +261,33 @@ export default {
         const data = await executeGiraffeql(this, {
           ['get' + this.capitalizedType]: {
             ...collapseObject(
-              fields.reduce((total, fieldKey) => {
-                const fieldInfo = this.recordInfo.fields[fieldKey]
-                // field unknown, abort
-                if (!fieldInfo) throw new Error('Unknown field: ' + fieldKey)
-
-                // if field is hidden, exclude
-                if (fieldInfo.hidden) return total
-
-                // if field has '+', add all of the fields
-                if (fieldKey.match(/\+/)) {
-                  fieldKey.split(/\+/).forEach((field) => {
-                    total[field] = true
-                    // assuming all fields are valid
-                    serializeMap.set(
-                      field,
-                      this.recordInfo.fields[field].serialize
-                    )
-                  })
-                } else {
-                  total[fieldKey] = true
-                  serializeMap.set(fieldKey, fieldInfo.serialize)
-                }
-                return total
-              }, {})
+              fields.reduce(
+                (total, fieldKey) => {
+                  const fieldInfo = this.recordInfo.fields[fieldKey]
+                  // field unknown, abort
+                  if (!fieldInfo) throw new Error('Unknown field: ' + fieldKey)
+
+                  // if field is hidden, exclude
+                  if (fieldInfo.hidden) return total
+
+                  // if field has '+', add all of the fields
+                  if (fieldKey.match(/\+/)) {
+                    fieldKey.split(/\+/).forEach((field) => {
+                      total[field] = true
+                      // assuming all fields are valid
+                      serializeMap.set(
+                        field,
+                        this.recordInfo.fields[field].serialize
+                      )
+                    })
+                  } else {
+                    total[fieldKey] = true
+                    serializeMap.set(fieldKey, fieldInfo.serialize)
+                  }
+                  return total
+                },
+                { id: true }
+              )
             ),
             __args: {
               id: this.selectedItem.id,
diff --git a/frontend/models/special/publicPbs.ts b/frontend/models/special/publicPbs.ts
index 8500a19..07c27ab 100644
--- a/frontend/models/special/publicPbs.ts
+++ b/frontend/models/special/publicPbs.ts
@@ -22,7 +22,7 @@ PublicPbs.expandTypes = [
       ...(<any>PublicPbs),
     },
     name: 'PB History',
-    excludeFilters: ['createdBy.id', 'is_current'],
+    excludeFilters: ['createdBy.id', 'isCurrent'],
     excludeHeaders: ['createdBy.name+createdBy.avatar+createdBy.id'],
     lockedFilters: (_that, item) => {
       return [
diff --git a/frontend/pages/my-pbs.vue b/frontend/pages/my-pbs.vue
index 7efcc06..30762e3 100644
--- a/frontend/pages/my-pbs.vue
+++ b/frontend/pages/my-pbs.vue
@@ -1,15 +1,19 @@
 <template>
-  <CrudRecordPage
-    :record-info="recordInfo"
-    :locked-filters="lockedFilters"
-    :hidden-filters="hiddenFilters"
-    :hidden-headers="hiddenHeaders"
-    :title="title"
-    :head="head"
-  ></CrudRecordPage>
+  <div>
+    <PbPagePreset></PbPagePreset>
+    <CrudRecordPage
+      :record-info="recordInfo"
+      :locked-filters="lockedFilters"
+      :hidden-filters="hiddenFilters"
+      :hidden-headers="hiddenHeaders"
+      :title="title"
+      :head="head"
+    ></CrudRecordPage>
+  </div>
 </template>
 
 <script>
+import PbPagePreset from '../components/page/preset/pbPagePreset.vue'
 import CrudRecordPage from '~/components/page/crudRecordPage.vue'
 import { MyPbs } from '~/models/special'
 
@@ -17,6 +21,7 @@ export default {
   middleware: ['router-auth'],
   components: {
     CrudRecordPage,
+    PbPagePreset,
   },
 
   data() {
diff --git a/frontend/pages/public-pbs.vue b/frontend/pages/public-pbs.vue
index 01aefdf..86d3878 100644
--- a/frontend/pages/public-pbs.vue
+++ b/frontend/pages/public-pbs.vue
@@ -1,37 +1,6 @@
 <template>
   <div>
-    <v-container fluid class="text-center pb-0" style="max-width: 1920px">
-      <v-progress-circular
-        v-if="loading.presets"
-        indeterminate
-      ></v-progress-circular>
-      <v-row v-else justify="center" class="pt-3">
-        <v-col :key="-1" cols="12" lg="3" class="pb-0">
-          <v-autocomplete
-            v-model="inputs.event"
-            :items="events"
-            item-text="name"
-            item-value="id"
-            label="Event"
-            filled
-            return-object
-            @change="applyEventPreset"
-          ></v-autocomplete>
-        </v-col>
-        <v-col :key="-2" cols="12" lg="3" class="pb-0">
-          <v-autocomplete
-            v-model="inputs.pbType"
-            :items="pbTypes"
-            item-text="text"
-            label="PB Type"
-            clearable
-            filled
-            return-object
-            @change="applyPbPreset"
-          ></v-autocomplete>
-        </v-col>
-      </v-row>
-    </v-container>
+    <PbPagePreset :event-clearable="false"></PbPagePreset>
     <CrudRecordPage
       :record-info="recordInfo"
       :locked-filters="lockedFilters"
@@ -44,14 +13,14 @@
 </template>
 
 <script>
+import PbPagePreset from '../components/page/preset/pbPagePreset.vue'
 import CrudRecordPage from '~/components/page/crudRecordPage.vue'
 import { PublicPbs } from '~/models/special'
-import { generateRoute } from '~/services/base'
-import { getEvents } from '~/services/dropdown'
 
 export default {
   components: {
     CrudRecordPage,
+    PbPagePreset,
   },
 
   data() {
@@ -74,194 +43,11 @@ export default {
         },
       ],
       title: 'Public PBs',
-      inputs: {
-        event: null,
-        pbType: null,
-      },
-
-      events: [],
-      pbTypes: [
-        {
-          text: 'Single',
-          attributes: {
-            'pbClass.id': 1,
-            setSize: 1,
-          },
-        },
-        {
-          text: 'Mo3',
-          attributes: {
-            'pbClass.id': 3,
-            setSize: 3,
-          },
-        },
-        {
-          text: 'Ao5',
-          attributes: {
-            'pbClass.id': 2,
-            setSize: 5,
-          },
-        },
-        {
-          text: 'Ao12',
-          attributes: {
-            'pbClass.id': 2,
-            setSize: 12,
-          },
-        },
-        {
-          text: 'Ao50',
-          attributes: {
-            'pbClass.id': 2,
-            setSize: 50,
-          },
-        },
-        {
-          text: 'Ao100',
-          attributes: {
-            'pbClass.id': 2,
-            setSize: 100,
-          },
-        },
-        {
-          text: 'Ao1000',
-          attributes: {
-            'pbClass.id': 2,
-            setSize: 1000,
-          },
-        },
-      ],
 
       loading: {
         presets: false,
       },
     }
   },
-  watch: {
-    '$route.query.pageOptions'() {
-      this.syncFilters()
-    },
-  },
-
-  mounted() {
-    this.loadPresets()
-  },
-
-  methods: {
-    applyEventPreset(event) {
-      // get the original sortBy/sortDesc
-      const originalPageOptions = this.$route.query.pageOptions
-        ? JSON.parse(atob(decodeURIComponent(this.$route.query.pageOptions)))
-        : null
-
-      // replace event.id filters with new ones
-      const excludeFilterKeys = ['event.id']
-
-      this.$router.push(
-        generateRoute(this.$route.path, {
-          ...originalPageOptions,
-          filters: (originalPageOptions?.filters
-            ? originalPageOptions.filters.filter(
-                (filterObject) =>
-                  !excludeFilterKeys.includes(filterObject.field)
-              )
-            : []
-          ).concat([
-            {
-              field: 'event.id',
-              operator: 'eq',
-              value: event.id,
-            },
-          ]),
-        })
-      )
-    },
-
-    applyPbPreset(pbType) {
-      // get the original sortBy/sortDesc/filters
-      const originalPageOptions = this.$route.query.pageOptions
-        ? JSON.parse(atob(decodeURIComponent(this.$route.query.pageOptions)))
-        : null
-
-      // replace event.id/setSize filters with new ones
-      const excludeFilterKeys = ['pbClass.id', 'setSize']
-
-      this.$router.push(
-        generateRoute(this.$route.path, {
-          ...originalPageOptions,
-          filters: (originalPageOptions?.filters
-            ? originalPageOptions.filters.filter(
-                (filterObject) =>
-                  !excludeFilterKeys.includes(filterObject.field)
-              )
-            : []
-          ).concat(
-            pbType
-              ? [
-                  {
-                    field: 'pbClass.id',
-                    operator: 'eq',
-                    value: pbType.attributes['pbClass.id'],
-                  },
-                  {
-                    field: 'setSize',
-                    operator: 'eq',
-                    value: pbType.attributes.setSize,
-                  },
-                ]
-              : []
-          ),
-        })
-      )
-    },
-
-    async loadPresets() {
-      this.loading.presets = true
-
-      this.events = await getEvents(this)
-
-      this.loading.presets = false
-    },
-
-    // syncs preset inputs with filters
-    syncFilters() {
-      const originalPageOptions = this.$route.query.pageOptions
-        ? JSON.parse(atob(decodeURIComponent(this.$route.query.pageOptions)))
-        : null
-
-      // determine if a preset was applied
-      if (originalPageOptions.filters) {
-        const eventFilterObject = originalPageOptions.filters.find(
-          (filterObject) => filterObject.field === 'event.id'
-        )
-
-        if (eventFilterObject) {
-          this.inputs.event = this.events.find(
-            (event) => event.id === eventFilterObject.value
-          )
-        } else {
-          this.inputs.event = null
-        }
-
-        const setSizeFilterObject = originalPageOptions.filters.find(
-          (filterObject) => filterObject.field === 'setSize'
-        )
-
-        const pbClassFilterObject = originalPageOptions.filters.find(
-          (filterObject) => filterObject.field === 'pbClass.id'
-        )
-
-        if (setSizeFilterObject && pbClassFilterObject) {
-          this.inputs.pbType = this.pbTypes.find(
-            (pbType) =>
-              pbType.attributes.setSize === setSizeFilterObject.value &&
-              pbType.attributes['pbClass.id'] === pbClassFilterObject.value
-          )
-        } else {
-          this.inputs.pbType = null
-        }
-      }
-    },
-  },
 }
 </script>
diff --git a/frontend/types/index.ts b/frontend/types/index.ts
index a979019..6c3c9d4 100644
--- a/frontend/types/index.ts
+++ b/frontend/types/index.ts
@@ -44,7 +44,7 @@ export type RecordInfo<T extends keyof MainTypes> = {
         | 'autocomplete' // same as combobox but cannot add new inputs
         | 'server-autocomplete' // if there's lots of entries, may not want to fetch all of the entries at once. getOptions will be optional
         | 'select' // standard select
-        | 'text' // default -- standard text field
+        | 'text'
       inputRules?: any[]
       getOptions?: (that) => Promise<any[]>
       typename?: string
@@ -180,6 +180,13 @@ export type RecordInfo<T extends keyof MainTypes> = {
       sortDesc: boolean[]
     }
   }[]
+
+  customActions?: {
+    text: string
+    icon: string
+
+    handleClick: (that, item) => void
+  }[]
 }
 
 type FilterObject = {