🔨 add types for database rows and prepare use of knex instead of TypeORM

adminSiteClient/ChartList.tsx

@@ -4,7 +4,7 @@ import { runInAction, observable } from "mobx"
 import { bind } from "decko"
 import { AdminAppContext, AdminAppContextType } from "./AdminAppContext.js"
 import { ChartTypeName, GrapherInterface } from "@ourworldindata/types"
-import { startCase, ChartTagJoin } from "@ourworldindata/utils"
+import { startCase, DbChartTagJoin } from "@ourworldindata/utils"
 import { References, getFullReferencesCount } from "./ChartEditor.js"
 import { ChartRow } from "./ChartRow.js"
 
@@ -28,7 +28,7 @@ export interface ChartListItem {
     publishedBy: string
     isExplorable: boolean
 
-    tags: ChartTagJoin[]
+    tags: DbChartTagJoin[]
 }
 
 @observer
@@ -40,7 +40,7 @@ export class ChartList extends React.Component<{
     static contextType = AdminAppContext
     context!: AdminAppContextType
 
-    @observable availableTags: ChartTagJoin[] = []
+    @observable availableTags: DbChartTagJoin[] = []
 
     async fetchRefs(grapherId: number | undefined): Promise<References> {
         const { admin } = this.context

adminSiteClient/ChartRow.tsx

@@ -11,19 +11,19 @@ import {
     BAKED_GRAPHER_URL,
 } from "../settings/clientSettings.js"
 import { ChartListItem, showChartType } from "./ChartList.js"
-import { TaggableType, ChartTagJoin } from "@ourworldindata/utils"
+import { TaggableType, DbChartTagJoin } from "@ourworldindata/utils"
 
 @observer
 export class ChartRow extends React.Component<{
     chart: ChartListItem
     searchHighlight?: (text: string) => string | JSX.Element
-    availableTags: ChartTagJoin[]
+    availableTags: DbChartTagJoin[]
     onDelete: (chart: ChartListItem) => void
 }> {
     static contextType = AdminAppContext
     context!: AdminAppContextType
 
-    async saveTags(tags: ChartTagJoin[]) {
+    async saveTags(tags: DbChartTagJoin[]) {
         const { chart } = this.props
         const json = await this.context.admin.requestJSON(
             `/api/charts/${chart.id}/setTags`,
@@ -35,7 +35,7 @@ export class ChartRow extends React.Component<{
         }
     }
 
-    @action.bound onSaveTags(tags: ChartTagJoin[]) {
+    @action.bound onSaveTags(tags: DbChartTagJoin[]) {
         this.saveTags(tags)
     }
 

adminSiteClient/DatasetEditPage.tsx

@@ -5,7 +5,7 @@ import * as lodash from "lodash"
 import { Prompt, Redirect } from "react-router-dom"
 import filenamify from "filenamify"
 
-import { OwidSource, ChartTagJoin, OwidOrigin } from "@ourworldindata/utils"
+import { OwidSource, DbChartTagJoin, OwidOrigin } from "@ourworldindata/utils"
 
 import { AdminLayout } from "./AdminLayout.js"
 import { Link } from "./Link.js"
@@ -66,7 +66,7 @@ class DatasetEditable {
         additionalInfo: "",
     }
 
-    @observable tags: ChartTagJoin[] = []
+    @observable tags: DbChartTagJoin[] = []
 
     constructor(json: DatasetPageData) {
         for (const key in this) {
@@ -83,7 +83,7 @@ class DatasetTagEditor extends React.Component<{
     newDataset: DatasetEditable
     availableTags: { id: number; name: string; parentName: string }[]
 }> {
-    @action.bound onSaveTags(tags: ChartTagJoin[]) {
+    @action.bound onSaveTags(tags: DbChartTagJoin[]) {
         this.props.newDataset.tags = tags
     }
 

adminSiteClient/DatasetList.tsx

@@ -5,7 +5,7 @@ import * as lodash from "lodash"
 import { bind } from "decko"
 
 import { Link } from "./Link.js"
-import { ChartTagJoin } from "@ourworldindata/utils"
+import { DbChartTagJoin } from "@ourworldindata/utils"
 import { AdminAppContext, AdminAppContextType } from "./AdminAppContext.js"
 import { Timeago } from "./Forms.js"
 import { EditableTags } from "./EditableTags.js"
@@ -20,7 +20,7 @@ export interface DatasetListItem {
     dataEditedByUserName: string
     metadataEditedAt: Date
     metadataEditedByUserName: string
-    tags: ChartTagJoin[]
+    tags: DbChartTagJoin[]
     isPrivate: boolean
     nonRedistributable: boolean
     version: string
@@ -30,13 +30,13 @@ export interface DatasetListItem {
 @observer
 class DatasetRow extends React.Component<{
     dataset: DatasetListItem
-    availableTags: ChartTagJoin[]
+    availableTags: DbChartTagJoin[]
     searchHighlight?: (text: string) => string | JSX.Element
 }> {
     static contextType = AdminAppContext
     context!: AdminAppContextType
 
-    async saveTags(tags: ChartTagJoin[]) {
+    async saveTags(tags: DbChartTagJoin[]) {
         const { dataset } = this.props
         const json = await this.context.admin.requestJSON(
             `/api/datasets/${dataset.id}/setTags`,
@@ -48,7 +48,7 @@ class DatasetRow extends React.Component<{
         }
     }
 
-    @action.bound onSaveTags(tags: ChartTagJoin[]) {
+    @action.bound onSaveTags(tags: DbChartTagJoin[]) {
         this.saveTags(tags)
     }
 
@@ -105,7 +105,7 @@ export class DatasetList extends React.Component<{
     static contextType = AdminAppContext
     context!: AdminAppContextType
 
-    @observable availableTags: ChartTagJoin[] = []
+    @observable availableTags: DbChartTagJoin[] = []
 
     @bind async getTags() {
         const json = await this.context.admin.getJSON("/api/tags.json")

adminSiteClient/EditTags.tsx

@@ -1,7 +1,7 @@
 import React from "react"
 import { action } from "mobx"
 import { observer } from "mobx-react"
-import { ChartTagJoin } from "@ourworldindata/utils"
+import { DbChartTagJoin } from "@ourworldindata/utils"
 import {
     ReactTags,
     ReactTagsAPI,
@@ -10,10 +10,10 @@ import {
 
 @observer
 export class EditTags extends React.Component<{
-    tags: ChartTagJoin[]
-    suggestions: ChartTagJoin[]
+    tags: DbChartTagJoin[]
+    suggestions: DbChartTagJoin[]
     onDelete: (index: number) => void
-    onAdd: (tag: ChartTagJoin) => void
+    onAdd: (tag: DbChartTagJoin) => void
     onSave: () => void
 }> {
     dismissable: boolean = true
@@ -66,7 +66,7 @@ export class EditTags extends React.Component<{
     }
 }
 
-const convertTagToAutocomplete = (t: ChartTagJoin) => ({
+const convertTagToAutocomplete = (t: DbChartTagJoin) => ({
     value: t.id,
     label: t.name,
 })

adminSiteClient/EditableTags.tsx

@@ -5,7 +5,7 @@ import { observer } from "mobx-react"
 import {
     KeyChartLevel,
     TaggableType,
-    ChartTagJoin,
+    DbChartTagJoin,
 } from "@ourworldindata/utils"
 import { TagBadge } from "./TagBadge.js"
 import { EditTags } from "./EditTags.js"
@@ -20,9 +20,9 @@ interface TaggableItem {
 
 @observer
 export class EditableTags extends React.Component<{
-    tags: ChartTagJoin[]
-    suggestions: ChartTagJoin[]
-    onSave: (tags: ChartTagJoin[]) => void
+    tags: DbChartTagJoin[]
+    suggestions: DbChartTagJoin[]
+    onSave: (tags: DbChartTagJoin[]) => void
     disabled?: boolean
     hasKeyChartSupport?: boolean
     hasSuggestionsSupport?: boolean
@@ -34,9 +34,9 @@ export class EditableTags extends React.Component<{
     @observable isEditing: boolean = false
     base: React.RefObject<HTMLDivElement> = React.createRef()
 
-    @observable tags: ChartTagJoin[] = lodash.clone(this.props.tags)
+    @observable tags: DbChartTagJoin[] = lodash.clone(this.props.tags)
 
-    @action.bound onAddTag(tag: ChartTagJoin) {
+    @action.bound onAddTag(tag: DbChartTagJoin) {
         this.tags.push(tag)
         this.tags = lodash
             // we only want to keep one occurrence of the same tag, whether
@@ -92,7 +92,7 @@ export class EditableTags extends React.Component<{
         const { taggable } = this.props
         if (!taggable?.id) return
 
-        const json: Record<"topics", ChartTagJoin[]> =
+        const json: Record<"topics", DbChartTagJoin[]> =
             await this.context.admin.getJSON(
                 `/api/gpt/suggest-topics/${taggable.type}/${taggable.id}.json`
             )
@@ -190,21 +190,21 @@ export class EditableTags extends React.Component<{
     }
 }
 
-const filterUncategorizedTag = (t: ChartTagJoin) => t.name !== "Uncategorized"
+const filterUncategorizedTag = (t: DbChartTagJoin) => t.name !== "Uncategorized"
 
-const filterUnlistedTag = (t: ChartTagJoin) => t.name !== "Unlisted"
+const filterUnlistedTag = (t: DbChartTagJoin) => t.name !== "Unlisted"
 
-const setDefaultKeyChartLevel = (t: ChartTagJoin) => {
+const setDefaultKeyChartLevel = (t: DbChartTagJoin) => {
     if (t.keyChartLevel === undefined) t.keyChartLevel = KeyChartLevel.None
     return t
 }
 
-const setTagStatusToPending = (t: ChartTagJoin) => {
+const setTagStatusToPending = (t: DbChartTagJoin) => {
     t.isApproved = false
     return t
 }
 
-const setTagStatusToApprovedIfUnset = (t: ChartTagJoin) => {
+const setTagStatusToApprovedIfUnset = (t: DbChartTagJoin) => {
     if (t.isApproved === undefined) t.isApproved = true
     return t
 }

adminSiteClient/PostsIndexPage.tsx

@@ -3,7 +3,7 @@ import { observer } from "mobx-react"
 import { observable, computed, action, runInAction } from "mobx"
 
 import {
-    ChartTagJoin,
+    DbChartTagJoin,
     Tag,
     buildSearchWordsFromSearchString,
     filterFunctionForSearchWords,
@@ -37,7 +37,7 @@ interface PostIndexMeta {
     authors: string[] | null
     slug: string
     updatedAtInWordpress: string | null
-    tags: ChartTagJoin[] | null
+    tags: DbChartTagJoin[] | null
     gdocSuccessorId: string | undefined
     gdocSuccessorPublished: boolean
     gdocSlugSuccessors: GDocSlugSuccessor[] | null
@@ -73,7 +73,7 @@ class PostRow extends React.Component<PostRowProps> {
             : GdocStatus.MISSING_NO_SLUG_SUCCESSOR
     }
 
-    async saveTags(tags: ChartTagJoin[]) {
+    async saveTags(tags: DbChartTagJoin[]) {
         const { post } = this.props
         const json = await this.context.admin.requestJSON(
             `/api/posts/${post.id}/setTags`,
@@ -85,7 +85,7 @@ class PostRow extends React.Component<PostRowProps> {
         }
     }
 
-    @action.bound onSaveTags(tags: ChartTagJoin[]) {
+    @action.bound onSaveTags(tags: DbChartTagJoin[]) {
         this.saveTags(tags)
     }
 

adminSiteClient/TagBadge.tsx

@@ -1,6 +1,6 @@
 import React from "react"
 import { observer } from "mobx-react"
-import { KeyChartLevel, ChartTagJoin } from "@ourworldindata/utils"
+import { KeyChartLevel, DbChartTagJoin } from "@ourworldindata/utils"
 
 import { Link } from "./Link.js"
 import Tippy from "@tippyjs/react"
@@ -11,7 +11,7 @@ import { faClock } from "@fortawesome/free-solid-svg-icons"
 
 @observer
 export class TagBadge extends React.Component<{
-    tag: ChartTagJoin
+    tag: DbChartTagJoin
     onToggleKey?: () => void
     onApprove?: () => void
     searchHighlight?: (text: string) => string | JSX.Element

adminSiteClient/TagEditPage.tsx

@@ -2,7 +2,7 @@ import React from "react"
 import { observer } from "mobx-react"
 import { observable, computed, action, runInAction } from "mobx"
 import { Prompt, Redirect } from "react-router-dom"
-import { ChartTagJoin } from "@ourworldindata/utils"
+import { DbChartTagJoin } from "@ourworldindata/utils"
 import { AdminLayout } from "./AdminLayout.js"
 import { BindString, NumericSelectField, FieldsRow, Timeago } from "./Forms.js"
 import { DatasetList, DatasetListItem } from "./DatasetList.js"
@@ -18,8 +18,8 @@ interface TagPageData {
     updatedAt: string
     datasets: DatasetListItem[]
     charts: ChartListItem[]
-    children: ChartTagJoin[]
-    possibleParents: ChartTagJoin[]
+    children: DbChartTagJoin[]
+    possibleParents: DbChartTagJoin[]
     isBulkImport: boolean
     slug: string | null
 }
@@ -174,7 +174,7 @@ class TagEditor extends React.Component<{ tag: TagPageData }> {
                                             <TagBadge
                                                 tag={
                                                     this
-                                                        .parentTag as ChartTagJoin
+                                                        .parentTag as DbChartTagJoin
                                                 }
                                             />
                                         )}
@@ -207,7 +207,7 @@ class TagEditor extends React.Component<{ tag: TagPageData }> {
                     <section>
                         <h3>Subcategories</h3>
                         {tag.children.map((c) => (
-                            <TagBadge tag={c as ChartTagJoin} key={c.id} />
+                            <TagBadge tag={c as DbChartTagJoin} key={c.id} />
                         ))}
                     </section>
                 )}

adminSiteClient/TagsIndexPage.tsx

@@ -5,7 +5,7 @@ import * as lodash from "lodash"
 import { Redirect } from "react-router-dom"
 import { AdminLayout } from "./AdminLayout.js"
 import { FieldsRow, Modal, TextField } from "./Forms.js"
-import { Tag, ChartTagJoin } from "@ourworldindata/utils"
+import { Tag, DbChartTagJoin } from "@ourworldindata/utils"
 import { TagBadge } from "./TagBadge.js"
 import { AdminAppContext, AdminAppContextType } from "./AdminAppContext.js"
 
@@ -146,7 +146,7 @@ export class TagsIndexPage extends React.Component {
                             {parentCategories.map((parent) => (
                                 <TagBadge
                                     key={parent.id}
-                                    tag={parent as ChartTagJoin}
+                                    tag={parent as DbChartTagJoin}
                                 />
                             ))}
                             <button