-
Notifications
You must be signed in to change notification settings - Fork 2
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
Showing
30 changed files
with
905 additions
and
222 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,21 @@ | ||
| { | ||
| // Use IntelliSense to learn about possible attributes. | ||
| // Hover to view descriptions of existing attributes. | ||
| // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387 | ||
| "version": "0.2.0", | ||
| "configurations": [ | ||
| { | ||
| "command": "bun run dev", | ||
| "name": "Run development server", | ||
| "request": "launch", | ||
| "type": "node-terminal" | ||
| }, | ||
| { | ||
| "type": "chrome", | ||
| "request": "launch", | ||
| "name": "Launch Chrome against localhost", | ||
| "url": "http://localhost:5173", | ||
| "webRoot": "${workspaceFolder}" | ||
| } | ||
| ] | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,2 @@ | ||
| [test] | ||
| preload = "./happydom.ts" |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,17 @@ | ||
| ## Frontend | ||
|
|
||
| - svelte | ||
|
|
||
| ## Backend | ||
|
|
||
| - designing RESTful APIs | ||
| - working with databases | ||
|
|
||
| ## System Design | ||
|
|
||
| ## DSA | ||
|
|
||
| ## Programming | ||
|
|
||
| - best practices | ||
| - testing & code-quality |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,3 @@ | ||
| import { GlobalRegistrator } from "@happy-dom/global-registrator"; | ||
|
|
||
| GlobalRegistrator.register(); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,56 @@ | ||
| <script lang="ts"> | ||
| import type { CardRevisePage } from '$lib/types/Card'; | ||
| import { formatDistanceToNow } from 'date-fns'; | ||
| import Trash from '~icons/arcticons/trashcan'; | ||
| import ReviewOptions from './ReviewOptions.svelte'; | ||
| import { enhance } from '$app/forms'; | ||
| export let card: CardRevisePage; | ||
| export let customEnhance; | ||
| export let modifyingCardId: string; | ||
| </script> | ||
|
|
||
| <div class="group relative rounded-md border border-gray-100 bg-white sm:h-96"> | ||
| <div class={`flex h-full w-full flex-col ${modifyingCardId === card.id ? 'blur-sm' : ''}`}> | ||
| <div | ||
| class="flex h-fit min-h-16 max-h-48 w-full justify-center overflow-y-auto rounded-md border-input ring-offset-background placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50" | ||
| id="question" | ||
| > | ||
| <div class="w-full whitespace-break-spaces p-6"> | ||
| {card.front} | ||
| </div> | ||
| </div> | ||
|
|
||
| <div class="relative flex grow min-h-48 border-t border-dashed"> | ||
| <form | ||
| class="absolute -top-5 right-0 z-10 bg-white" | ||
| method="post" | ||
| action="?/delete" | ||
| use:enhance={customEnhance} | ||
| > | ||
| <input type="hidden" hidden name="cardId" value={card.id} /> | ||
| <button | ||
| class="flex items-center space-x-1 rounded-md border px-4 py-2 hover:bg-accent hover:text-accent-foreground hover:outline disabled:pointer-events-none disabled:opacity-50" | ||
| disabled={modifyingCardId === card.id} | ||
| type="submit" | ||
| title="move to trash" | ||
| data-testid="trash" | ||
| > | ||
| <Trash style="stroke-width:2px;" /><span></span> | ||
| </button> | ||
| </form> | ||
| <div | ||
| class="h-full w-full items-center overflow-y-auto whitespace-break-spaces p-6 ring-offset-background blur-md placeholder:text-muted-foreground hover:filter-none focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50" | ||
| id="answer" | ||
| > | ||
| {card.back} | ||
| </div> | ||
| </div> | ||
| <div class="w-full"> | ||
| <ReviewOptions cardId={card.id} {customEnhance} /> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| <div class="p-2 text-right text-sm text-gray-200" title={String(card.createdAt)}> | ||
| added {formatDistanceToNow(card.createdAt)} ago | ||
| </div> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,26 @@ | ||
| <script lang="ts"> | ||
| import type { CardRevisePage } from '$lib/types/Card'; | ||
| import { humanReadableDate } from '$lib/common.util'; | ||
| import Card from './Card.svelte'; | ||
| export let date: string; | ||
| export let cards: CardRevisePage[]; | ||
| export let customEnhance; | ||
| export let modifyingCardId: string; | ||
| export let firstCardId: string; | ||
| </script> | ||
|
|
||
| <div class="relative"> | ||
| <div | ||
| class="mb-2 flex h-10 w-16 items-center justify-center rounded-full border border-gray-100 text-center text-gray-400" | ||
| title={date} | ||
| > | ||
| {humanReadableDate(cards[0].nextPractice)} | ||
| </div> | ||
| <div class="absolute left-8 top-10 -z-10 h-full border-r border-gray-100"></div> | ||
| {#each cards as card (card.id)} | ||
| <div class="{`mb-16 ${card.id === firstCardId ? 'first:min-h-screen' : ''}`}}"> | ||
| <Card {card} {customEnhance} {modifyingCardId}></Card> | ||
| </div> | ||
| {/each} | ||
| </div> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,71 @@ | ||
| <script lang="ts"> | ||
| import type { CardRevisePage } from '$lib/types/Card'; | ||
| import type { ActionResult } from '@sveltejs/kit'; | ||
| import { format } from 'date-fns'; | ||
| import CardGroup from './CardGroup.svelte'; | ||
| import ReviewProgress from './ReviewProgress.svelte'; | ||
| import { toast } from '@zerodevx/svelte-toast'; | ||
| export let cards: CardRevisePage[]; | ||
| let groupedCards: { [key: string]: CardRevisePage[] } = {}; | ||
| let dates: string[] = []; | ||
| let revisedCards: string[] = []; | ||
| let remainingCards: CardRevisePage[] = []; | ||
| let firstCardId = ''; | ||
| $: { | ||
| remainingCards = cards.filter((card) => !revisedCards.includes(card.id)); | ||
| groupedCards = groupCards(remainingCards); | ||
| dates = Object.keys(groupedCards).sort((a, b) => new Date(a).getTime() - new Date(b).getTime()); | ||
| firstCardId = groupCards(remainingCards)[dates[0]]?.[0]?.id; | ||
| } | ||
| let modifyingCardId = ''; | ||
| const customEnhance = ({ formData }: { formData: FormData }) => { | ||
| const id = formData.get('cardId') as string; | ||
| revisedCards = [...revisedCards, id]; | ||
| modifyingCardId = id; | ||
| return ({ result }: { result: ActionResult }) => { | ||
| modifyingCardId = ''; | ||
| if (result.type === 'error' || result.type === 'failure') { | ||
| toast.push('Failed to perform that action', { | ||
| theme: { | ||
| '--toastColor': 'white', | ||
| '--toastBackground': 'rgba(220,53,69,0.9)', | ||
| '--toastBarBackground': '#C53030' | ||
| } | ||
| }); | ||
| } | ||
| }; | ||
| }; | ||
| function groupCards(cards: CardRevisePage[]): { [key: string]: CardRevisePage[] } { | ||
| return cards.reduce((groups: { [key: string]: CardRevisePage[] }, card) => { | ||
| const date = format(card.nextPractice, 'P'); | ||
| if (!groups[date]) { | ||
| groups[date] = []; | ||
| } | ||
| groups[date].push(card); | ||
| return groups; | ||
| }, {}); | ||
| } | ||
| </script> | ||
|
|
||
| <div class="relative mx-auto mt-10 max-w-lg space-y-4 rounded-lg"> | ||
| <ReviewProgress {remainingCards} {revisedCards} {cards} /> | ||
|
|
||
| <div class="mx-4 mt-10"> | ||
| {#if cards.length > 0} | ||
| {#each dates as date (date)} | ||
| <CardGroup | ||
| {firstCardId} | ||
| {date} | ||
| cards={groupedCards[date]} | ||
| {customEnhance} | ||
| {modifyingCardId} | ||
| /> | ||
| {/each} | ||
| {/if} | ||
| </div> | ||
| </div> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,30 @@ | ||
| <script lang="ts"> | ||
| import { enhance } from '$app/forms'; | ||
| export let cardId: string; | ||
| export let customEnhance; | ||
| const options = [ | ||
| { value: 'Easy', text: 'super easy' }, | ||
| { value: 'Good', text: 'easy' }, | ||
| { value: 'Hard', text: 'difficult' }, | ||
| { value: 'Challenging', text: 'super difficult' } | ||
| ]; | ||
| </script> | ||
|
|
||
| <form method="post" action="?/review" use:enhance={customEnhance}> | ||
| <input type="hidden" hidden name="cardId" value={cardId} /> | ||
| <div | ||
| class="flex w-full flex-col border-t border-gray-100 sm:flex-row sm:rounded-bl-md sm:rounded-br-md" | ||
| > | ||
| {#each options as { value, text } (value)} | ||
| <button | ||
| class="w-full whitespace-nowrap border-b border-gray-100 bg-background px-4 py-4 text-center -outline-offset-2 ring-offset-background transition-colors last:rounded-b-sm hover:bg-accent hover:text-accent-foreground hover:outline focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 sm:border-b-0 sm:border-l sm:first:rounded-bl-sm sm:first:border-l-0 sm:last:rounded-bl-none sm:last:rounded-br-sm" | ||
| name="difficulty" | ||
| {value} | ||
| > | ||
| <span>{text}</span> | ||
| </button> | ||
| {/each} | ||
| </div> | ||
| </form> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,22 @@ | ||
| <script lang="ts"> | ||
| import type { CardRevisePage } from '$lib/types/Card'; | ||
| export let cards: CardRevisePage[]; | ||
| export let revisedCards: string[]; | ||
| export let remainingCards: CardRevisePage[]; | ||
| let reviseCards = 5; | ||
| </script> | ||
|
|
||
| {#if remainingCards.length === 0} | ||
| <div class="text-center"> | ||
| You have revised all the cards. Go to <a href="/record" class="underline">Record</a> to create more | ||
| </div> | ||
| {:else if revisedCards.length > 0 && revisedCards.length % reviseCards === 0} | ||
| <div class="text-center text-lg text-gray-500"> | ||
| Hurray. You revised {revisedCards.length} cards. Take a break or keep going. | ||
| </div> | ||
| {:else} | ||
| <div class="text-center text-lg text-gray-400"> | ||
| cards reviewed: {revisedCards.length}/{cards.length} | ||
| </div> | ||
| {/if} |
Oops, something went wrong.