diff --git a/src/components/CardManagerView/CardManagerView.tsx b/src/components/CardManagerView/CardManagerView.tsx
index 8a12f67..0c2d09b 100644
--- a/src/components/CardManagerView/CardManagerView.tsx
+++ b/src/components/CardManagerView/CardManagerView.tsx
@@ -4,7 +4,7 @@ import { IconSearch } from "@tabler/icons-react";
 import { useState } from "react";
 import { Outlet, useLocation, useNavigate, useParams } from "react-router-dom";
 import { useCardsWith } from "../../logic/card";
-import selectCards from "../../logic/card_filter";
+import selectCards, { SortField } from "../../logic/card_filter";
 import { useDecks } from "../../logic/deck";
 import CardTable from "../CardTable/CardTable";
 import { AppHeaderContent } from "../Header/Header";
@@ -26,7 +26,7 @@ function CardManagerView() {
 
   const [filter, setFilter] = useDebouncedState<string>("", 250);
 
-  const [sort, setSort] = useState<[string, boolean]>(["front", true]);
+  const [sort, setSort] = useState<[SortField, boolean]>(["front", true]);
 
   const [cards] = useCardsWith(
     (cards) => selectCards(cards, deckId, filter, sort),
diff --git a/src/components/CardTable/CardTable.tsx b/src/components/CardTable/CardTable.tsx
index d3ecb48..44e1e2d 100644
--- a/src/components/CardTable/CardTable.tsx
+++ b/src/components/CardTable/CardTable.tsx
@@ -5,6 +5,7 @@ import { Table, Text } from "@mantine/core";
 import { useEventListener } from "@mantine/hooks";
 import CardTableHeadItem from "./CardTableHeadItem";
 import { CardTableItem } from "./CardTableItem";
+import { SortField } from "../../logic/card_filter";
 
 interface CardTableProps {
   cardSet: Card<CardType>[];
@@ -12,8 +13,8 @@ interface CardTableProps {
   setSelectedIndex: (index: number) => void;
   selectedCard: Card<CardType> | undefined;
   setSelectedCard: (card: Card<CardType>) => void;
-  sort: [string, boolean];
-  setSort: (sort: [string, boolean]) => void;
+  sort: [SortField, boolean];
+  setSort: (sort: [SortField, boolean]) => void;
 }
 
 function CardTable({
diff --git a/src/components/CardTable/CardTableHeadItem.tsx b/src/components/CardTable/CardTableHeadItem.tsx
index 71c1f41..72b0785 100644
--- a/src/components/CardTable/CardTableHeadItem.tsx
+++ b/src/components/CardTable/CardTableHeadItem.tsx
@@ -3,12 +3,13 @@ import cx from "clsx";
 import React from "react";
 import { Box, Table } from "@mantine/core";
 import { IconArrowUp } from "@tabler/icons-react";
+import { SortField } from "../../logic/card_filter";
 
 interface CardTableHeadItemProps {
   name: string;
-  id: string;
-  sort: [string, boolean];
-  setSort: (sort: [string, boolean]) => void;
+  id: SortField;
+  sort: [SortField, boolean];
+  setSort: (sort: [SortField, boolean]) => void;
 }
 
 export default function CardTableHeadItem({
diff --git a/src/logic/card_filter.ts b/src/logic/card_filter.ts
index 369da0c..f57cedb 100644
--- a/src/logic/card_filter.ts
+++ b/src/logic/card_filter.ts
@@ -3,11 +3,13 @@ import { Card, CardType, getCardsOf } from "./card";
 import { getUtils } from "./CardTypeManager";
 import { getDeck } from "./deck";
 
+export type SortField = "front" | "creation_date" | "deck" | "type";
+
 export default async function selectCards(
   cards: Table<Card<CardType>>,
   deckId: string | undefined,
   filter: string,
-  sort: [string, boolean]
+  sort: [SortField, boolean]
 ): Promise<Card<CardType>[] | undefined> {
   let filteredCards:
     | Table<Card<CardType>>