move filtering logic to ProjectContentStore

studio/pages/project/[ref]/logs-explorer/saved.tsx

@@ -22,7 +22,6 @@ export const LogsSavedPage: NextPage = () => {
     }
   }, [ui.selectedProject])
 
-  const contentList = content.list()
   if (content.isLoading) {
     return (
       <LogsExplorerLayout>
@@ -30,8 +29,8 @@ export const LogsSavedPage: NextPage = () => {
       </LogsExplorerLayout>
     )
   }
+  const saved = content.logSqlSnippets()
 
-  const saved: UserContent[] = (contentList?.[0] || []).filter((content: UserContent)=> content.type === 'log_sql')
   return (
     <LogsExplorerLayout>
       <div className="flex flex-col gap-3">

studio/stores/content/ProjectContentStore.ts

@@ -9,6 +9,7 @@ import { API_URL } from 'lib/constants'
 // [Joshen] This will be the new ProjectContentStore
 // but use the one under the stores folder projectContentStore first while we transition
 
+type CustomFilter = (content: UserContent) => boolean
 export interface IProjectContentStore {
   isLoading: boolean
   isInitialized: boolean
@@ -20,6 +21,7 @@ export interface IProjectContentStore {
   list: (filter?: any) => any[]
   reports: (filter?: any) => any[]
   sqlSnippets: (filter?: any) => any[]
+  logSqlSnippets: (filter?: CustomFilter) => UserContent[]
 }
 
 export default class ProjectContentStore implements IProjectContentStore {
@@ -133,6 +135,15 @@ export default class ProjectContentStore implements IProjectContentStore {
     }
   }
 
+  logSqlSnippets(filter?: CustomFilter) {
+    let arr = (Object.values(this.data)[0] as any || []) as UserContent[]
+    let snippets = arr.filter(c => c.type === 'log_sql')
+    if (filter) {
+      snippets = snippets.filter(filter)
+    }
+    return snippets.sort((a, b) => a.name.localeCompare(b.name))
+  }
+
   // @ts-ignore
   async create(payload: any) {
     try {

studio/stores/projectContentStore.ts

@@ -10,6 +10,7 @@ import { API_URL } from 'lib/constants'
  *   import { useProjectContentStore } from 'stores/userContent/projectContentStore'
  *   const contentStore = useProjectContentStore(projectRef)
  *   contentStore.load() // inside usEffect()
+ * @deprecated use content store on RootStore instead.
  */
 let store: any = null
 let projectRef: any = null
@@ -32,6 +33,7 @@ interface UserContentMap {
 
 /**
  * MobX Store
+ * @deprecated
  */
 export default class ProjectContent {
   STATES = {