mirror of
https://github.com/Steffo99/todocolors.git
synced 2024-11-21 07:44:18 +00:00
Update!
This commit is contained in:
parent
db35005190
commit
d96cb1564e
53 changed files with 4523 additions and 508 deletions
|
@ -1,14 +1,8 @@
|
|||
<component name="ProjectRunConfigurationManager">
|
||||
<configuration default="false" name="Run server" type="CargoCommandRunConfiguration" factoryName="Cargo Command">
|
||||
<option name="buildProfileId" value="dev" />
|
||||
<option name="command" value="run" />
|
||||
<option name="workingDirectory" value="file://$PROJECT_DIR$/todored" />
|
||||
<option name="emulateTerminal" value="true" />
|
||||
<option name="channel" value="DEFAULT" />
|
||||
<option name="requiredFeatures" value="true" />
|
||||
<option name="allFeatures" value="false" />
|
||||
<option name="withSudo" value="false" />
|
||||
<option name="buildTarget" value="REMOTE" />
|
||||
<option name="backtrace" value="SHORT" />
|
||||
<envs>
|
||||
<env name="AXUM_HOST" value="0.0.0.0:8080" />
|
||||
<env name="REDIS_CONN" value="redis://127.0.0.1:6379/" />
|
||||
|
@ -16,6 +10,13 @@
|
|||
<env name="TODORED_RATE_LIMIT_CONNECTIONS_PER_MINUTE" value="0" />
|
||||
<env name="TODORED_RATE_LIMIT_MESSAGES_PER_MINUTE" value="0" />
|
||||
</envs>
|
||||
<option name="emulateTerminal" value="true" />
|
||||
<option name="channel" value="DEFAULT" />
|
||||
<option name="requiredFeatures" value="true" />
|
||||
<option name="allFeatures" value="false" />
|
||||
<option name="withSudo" value="false" />
|
||||
<option name="buildTarget" value="REMOTE" />
|
||||
<option name="backtrace" value="SHORT" />
|
||||
<option name="isRedirectInput" value="false" />
|
||||
<option name="redirectInputPath" value="" />
|
||||
<method v="2">
|
||||
|
|
2
todoblue/.gitignore
vendored
2
todoblue/.gitignore
vendored
|
@ -1,5 +1,7 @@
|
|||
# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
|
||||
|
||||
.npmrc
|
||||
|
||||
# dependencies
|
||||
/node_modules
|
||||
/.pnp
|
||||
|
|
|
@ -10,11 +10,11 @@
|
|||
"lint": "next lint"
|
||||
},
|
||||
"dependencies": {
|
||||
"@awesome.me/kit-dfe340c874": "^1.0.10",
|
||||
"@fortawesome/fontawesome-svg-core": "*",
|
||||
"@fortawesome/free-regular-svg-icons": "*",
|
||||
"@fortawesome/free-solid-svg-icons": "*",
|
||||
"@fortawesome/react-fontawesome": "*",
|
||||
"@steffo/bluelib": "*",
|
||||
"any-date-parser": "^1.5.4",
|
||||
"classnames": "*",
|
||||
"client-only": "*",
|
||||
"i18next": "*",
|
||||
|
|
|
@ -30,27 +30,6 @@
|
|||
"taskStatusInProgress": "In progress",
|
||||
"taskStatusComplete": "Complete",
|
||||
"taskStatusJournaled": "Journaled",
|
||||
"taskIconBookmark": "Bookmark",
|
||||
"taskIconCircle": "Circle",
|
||||
"taskIconSquare": "Square",
|
||||
"taskIconHeart": "Heart",
|
||||
"taskIconStar": "Star",
|
||||
"taskIconSun": "Sun",
|
||||
"taskIconMoon": "Moon",
|
||||
"taskIconEye": "Eye",
|
||||
"taskIconHand": "Hand",
|
||||
"taskIconHandshake": "Handshake",
|
||||
"taskIconFaceSmile": "Smile",
|
||||
"taskIconUser": "User",
|
||||
"taskIconComment": "Comment",
|
||||
"taskIconEnvelope": "Envelope",
|
||||
"taskIconFile": "File",
|
||||
"taskIconPaperPlane": "Paper plane",
|
||||
"taskIconBuilding": "Building",
|
||||
"taskIconFlag": "Flag",
|
||||
"taskIconBell": "Bell",
|
||||
"taskIconClock": "Clock",
|
||||
"taskIconImage": "Image",
|
||||
"taskButtonJournal": "Move this task to the Journal",
|
||||
"taskButtonUnjournal": "Remove this task from the Journal",
|
||||
"taskButtonDelete": "Delete this task",
|
||||
|
|
|
@ -30,27 +30,6 @@
|
|||
"taskStatusInProgress": "In corso",
|
||||
"taskStatusComplete": "Completato",
|
||||
"taskStatusJournaled": "Salvato nel Diario",
|
||||
"taskIconBookmark": "Segnalibro",
|
||||
"taskIconCircle": "Cerchio",
|
||||
"taskIconSquare": "Quadrato",
|
||||
"taskIconHeart": "Cuore",
|
||||
"taskIconStar": "Stella",
|
||||
"taskIconSun": "Sole",
|
||||
"taskIconMoon": "Luna",
|
||||
"taskIconEye": "Occhio",
|
||||
"taskIconHand": "Mano",
|
||||
"taskIconHandshake": "Stretta di mano",
|
||||
"taskIconFaceSmile": "Sorriso",
|
||||
"taskIconUser": "Utente",
|
||||
"taskIconComment": "Commento",
|
||||
"taskIconEnvelope": "Busta",
|
||||
"taskIconFile": "File",
|
||||
"taskIconPaperPlane": "Aeroplano di carta",
|
||||
"taskIconBuilding": "Edificio",
|
||||
"taskIconFlag": "Bandiera",
|
||||
"taskIconBell": "Campana",
|
||||
"taskIconClock": "Orologio",
|
||||
"taskIconImage": "Immagine",
|
||||
"taskButtonJournal": "Sposta questa attività nel Diario",
|
||||
"taskButtonUnjournal": "Rimuovi questa attività dal Diario",
|
||||
"taskButtonDelete": "Elimina questa attività",
|
||||
|
|
|
@ -51,7 +51,7 @@ export function StarredProvider({children}: {children: ReactNode}) {
|
|||
}, [])
|
||||
|
||||
const isStarred = useCallback((value: string) => {
|
||||
return starred.indexOf(value) >= 0
|
||||
return starred.includes(value)
|
||||
}, [starred])
|
||||
|
||||
return (
|
||||
|
|
|
@ -1,7 +1,7 @@
|
|||
"use client";
|
||||
|
||||
import {useClientTranslation} from "@/app/(i18n)/client"
|
||||
import {faLock} from "@fortawesome/free-solid-svg-icons"
|
||||
import {fas} from "@awesome.me/kit-dfe340c874/icons"
|
||||
import {FontAwesomeIcon} from "@fortawesome/react-fontawesome"
|
||||
import classNames from "classnames"
|
||||
import {useRouter} from "next/navigation"
|
||||
|
@ -71,7 +71,7 @@ export function CreatePrivateBoardPanel({lang}: {lang: string}) {
|
|||
onSubmit={createBoardValidated}
|
||||
>
|
||||
<h3>
|
||||
<FontAwesomeIcon icon={faLock} size={"1x"}/>
|
||||
<FontAwesomeIcon icon={fas.faLock} size={"1x"}/>
|
||||
{" "}
|
||||
{t("createPrivateBoardTitle")}
|
||||
</h3>
|
||||
|
|
|
@ -2,7 +2,7 @@
|
|||
|
||||
import {useClientTranslation} from "@/app/(i18n)/client"
|
||||
import {useLowerKebabifier} from "@/app/(utils)/(kebab)"
|
||||
import {faGlobe} from "@fortawesome/free-solid-svg-icons"
|
||||
import {fas} from "@awesome.me/kit-dfe340c874/icons"
|
||||
import {FontAwesomeIcon} from "@fortawesome/react-fontawesome"
|
||||
import cn from "classnames"
|
||||
import {useRouter} from "next/navigation"
|
||||
|
@ -32,7 +32,7 @@ export function CreatePublicBoardPanel({lang}: {lang: string}) {
|
|||
onSubmit={createBoardValidated}
|
||||
>
|
||||
<h3>
|
||||
<FontAwesomeIcon icon={faGlobe}/>
|
||||
<FontAwesomeIcon icon={fas.faGlobe}/>
|
||||
{" "}
|
||||
{t("createPublicBoardTitle")}
|
||||
</h3>
|
||||
|
|
|
@ -2,7 +2,7 @@
|
|||
|
||||
import {useClientTranslation} from "@/app/(i18n)/client"
|
||||
import {useLowerKebabifier} from "@/app/(utils)/(kebab)"
|
||||
import {faKey} from "@fortawesome/free-solid-svg-icons"
|
||||
import {fas} from "@awesome.me/kit-dfe340c874/icons"
|
||||
import {FontAwesomeIcon} from "@fortawesome/react-fontawesome"
|
||||
import cn from "classnames"
|
||||
import {useRouter} from "next/navigation"
|
||||
|
@ -32,7 +32,7 @@ export function KnownBoardsPanel({lang}: {lang: string}) {
|
|||
onSubmit={moveToBoardValidated}
|
||||
>
|
||||
<h3>
|
||||
<FontAwesomeIcon icon={faKey}/>
|
||||
<FontAwesomeIcon icon={fas.faKey}/>
|
||||
{" "}
|
||||
{t("existingKnownBoardsTitle")}
|
||||
</h3>
|
||||
|
|
|
@ -2,7 +2,7 @@
|
|||
|
||||
import {useClientTranslation} from "@/app/(i18n)/client"
|
||||
import {useStarredConsumer} from "@/app/[lang]/(layout)/(contextStarred)"
|
||||
import {faStar} from "@fortawesome/free-solid-svg-icons"
|
||||
import {fas} from "@awesome.me/kit-dfe340c874/icons"
|
||||
import {FontAwesomeIcon} from "@fortawesome/react-fontawesome"
|
||||
import cn from "classnames"
|
||||
import Link from "next/link"
|
||||
|
@ -66,7 +66,7 @@ export function StarredBoardsPanel({lang}: {lang: string}) {
|
|||
"box": true,
|
||||
})}>
|
||||
<h3>
|
||||
<FontAwesomeIcon icon={faStar}/>
|
||||
<FontAwesomeIcon icon={fas.faStar}/>
|
||||
{" "}
|
||||
{t("existingStarredBoardsTitle")}
|
||||
</h3>
|
||||
|
|
|
@ -1,13 +1,11 @@
|
|||
import {TaskIcon} from "@/app/[lang]/board/[board]/(api)/(task)/TaskIcon"
|
||||
import {TaskImportance} from "@/app/[lang]/board/[board]/(api)/(task)/TaskImportance"
|
||||
import {TaskPriority} from "@/app/[lang]/board/[board]/(api)/(task)/TaskPriority"
|
||||
|
||||
|
||||
export type Task = {
|
||||
text: string,
|
||||
icon: TaskIcon,
|
||||
icon: string,
|
||||
importance: TaskImportance,
|
||||
priority: TaskPriority,
|
||||
deadline: number | null,
|
||||
created_on: number | null,
|
||||
started_on: number | null,
|
||||
completed_on: number | null,
|
||||
|
|
File diff suppressed because it is too large
Load diff
|
@ -1,10 +0,0 @@
|
|||
/**
|
||||
* **Enum** of priority levels a {@link Task} may have.
|
||||
*/
|
||||
export enum TaskPriority {
|
||||
Highest = "Highest",
|
||||
High = "High",
|
||||
Normal = "Normal",
|
||||
Low = "Low",
|
||||
Lowest = "Lowest",
|
||||
}
|
|
@ -1,7 +1,4 @@
|
|||
export {TaskIcon} from "./TaskIcon"
|
||||
export {TaskImportance} from "./TaskImportance"
|
||||
export {TaskPriority} from "./TaskPriority"
|
||||
export {TASK_ICON_TO_FONTAWESOME_SOLID, TASK_ICON_TO_FONTAWESOME_REGULAR} from "./taskIconMappings"
|
||||
|
||||
export type {Task} from "./Task"
|
||||
export type {TaskId} from "./TaskId"
|
||||
|
|
|
@ -1,52 +0,0 @@
|
|||
import {faBell as faBellRegular, faBookmark as faBookmarkRegular, faBuilding as faBuildingRegular, faCircle as faCircleRegular, faClock as faClockRegular, faComment as faCommentRegular, faEnvelope as faEnvelopeRegular, faEye as faEyeRegular, faFaceSmile as faFaceSmileRegular, faFile as faFileRegular, faFlag as faFlagRegular, faHand as faHandRegular, faHandshake as faHandshakeRegular, faHeart as faHeartRegular, faImage as faImageRegular, faMoon as faMoonRegular, faPaperPlane as faPaperPlaneRegular, faSquare as faSquareRegular, faStar as faStarRegular, faSun as faSunRegular, faUser as faUserRegular} from "@fortawesome/free-regular-svg-icons"
|
||||
import {faBell as faBellSolid, faBookmark as faBookmarkSolid, faBuilding as faBuildingSolid, faCircle as faCircleSolid, faClock as faClockSolid, faComment as faCommentSolid, faEnvelope as faEnvelopeSolid, faEye as faEyeSolid, faFaceSmile as faFaceSmileSolid, faFile as faFileSolid, faFlag as faFlagSolid, faHand as faHandSolid, faHandshake as faHandshakeSolid, faHeart as faHeartSolid, faImage as faImageSolid, faMoon as faMoonSolid, faPaperPlane as faPaperPlaneSolid, faSquare as faSquareSolid, faStar as faStarSolid, faSun as faSunSolid, faUser as faUserSolid, IconDefinition} from "@fortawesome/free-solid-svg-icons"
|
||||
import {TaskIcon} from "./TaskIcon"
|
||||
|
||||
|
||||
export const TASK_ICON_TO_FONTAWESOME_SOLID: {[T in TaskIcon]: IconDefinition} = {
|
||||
[TaskIcon.User]: faUserSolid,
|
||||
[TaskIcon.Image]: faImageSolid,
|
||||
[TaskIcon.Envelope]: faEnvelopeSolid,
|
||||
[TaskIcon.Star]: faStarSolid,
|
||||
[TaskIcon.Heart]: faHeartSolid,
|
||||
[TaskIcon.Comment]: faCommentSolid,
|
||||
[TaskIcon.FaceSmile]: faFaceSmileSolid,
|
||||
[TaskIcon.File]: faFileSolid,
|
||||
[TaskIcon.Bell]: faBellSolid,
|
||||
[TaskIcon.Bookmark]: faBookmarkSolid,
|
||||
[TaskIcon.Eye]: faEyeSolid,
|
||||
[TaskIcon.Hand]: faHandSolid,
|
||||
[TaskIcon.PaperPlane]: faPaperPlaneSolid,
|
||||
[TaskIcon.Handshake]: faHandshakeSolid,
|
||||
[TaskIcon.Sun]: faSunSolid,
|
||||
[TaskIcon.Clock]: faClockSolid,
|
||||
[TaskIcon.Circle]: faCircleSolid,
|
||||
[TaskIcon.Square]: faSquareSolid,
|
||||
[TaskIcon.Building]: faBuildingSolid,
|
||||
[TaskIcon.Flag]: faFlagSolid,
|
||||
[TaskIcon.Moon]: faMoonSolid,
|
||||
}
|
||||
|
||||
export const TASK_ICON_TO_FONTAWESOME_REGULAR: {[T in TaskIcon]: IconDefinition} = {
|
||||
[TaskIcon.User]: faUserRegular,
|
||||
[TaskIcon.Image]: faImageRegular,
|
||||
[TaskIcon.Envelope]: faEnvelopeRegular,
|
||||
[TaskIcon.Star]: faStarRegular,
|
||||
[TaskIcon.Heart]: faHeartRegular,
|
||||
[TaskIcon.Comment]: faCommentRegular,
|
||||
[TaskIcon.FaceSmile]: faFaceSmileRegular,
|
||||
[TaskIcon.File]: faFileRegular,
|
||||
[TaskIcon.Bell]: faBellRegular,
|
||||
[TaskIcon.Bookmark]: faBookmarkRegular,
|
||||
[TaskIcon.Eye]: faEyeRegular,
|
||||
[TaskIcon.Hand]: faHandRegular,
|
||||
[TaskIcon.PaperPlane]: faPaperPlaneRegular,
|
||||
[TaskIcon.Handshake]: faHandshakeRegular,
|
||||
[TaskIcon.Sun]: faSunRegular,
|
||||
[TaskIcon.Clock]: faClockRegular,
|
||||
[TaskIcon.Circle]: faCircleRegular,
|
||||
[TaskIcon.Square]: faSquareRegular,
|
||||
[TaskIcon.Building]: faBuildingRegular,
|
||||
[TaskIcon.Flag]: faFlagRegular,
|
||||
[TaskIcon.Moon]: faMoonRegular,
|
||||
}
|
|
@ -1,4 +1,4 @@
|
|||
import {TaskIcon} from "@/app/[lang]/board/[board]/(api)/(task)"
|
||||
import {ICONS} from "@/app/[lang]/board/[board]/(api)/(task)/TaskIcon"
|
||||
import {useBoardConsumer} from "@/app/[lang]/board/[board]/(layout)/(contextBoard)"
|
||||
import {TaskEditorIcon} from "@/app/[lang]/board/[board]/(page)/(edit)/(task)/TaskEditorIcon"
|
||||
import {TaskEditorInput} from "@/app/[lang]/board/[board]/(page)/(edit)/(task)/TaskEditorInput"
|
||||
|
@ -12,57 +12,34 @@ import {SyntheticEvent, useCallback} from "react"
|
|||
import style from "./TaskEditor.module.css"
|
||||
|
||||
|
||||
const ICON_SEQUENCE = [
|
||||
TaskIcon.Bookmark,
|
||||
TaskIcon.Circle,
|
||||
TaskIcon.Square,
|
||||
TaskIcon.Heart,
|
||||
TaskIcon.Star,
|
||||
TaskIcon.Sun,
|
||||
TaskIcon.Moon,
|
||||
TaskIcon.Eye,
|
||||
TaskIcon.Hand,
|
||||
TaskIcon.Handshake,
|
||||
TaskIcon.FaceSmile,
|
||||
TaskIcon.User,
|
||||
TaskIcon.Comment,
|
||||
TaskIcon.Envelope,
|
||||
TaskIcon.File,
|
||||
TaskIcon.PaperPlane,
|
||||
TaskIcon.Building,
|
||||
TaskIcon.Flag,
|
||||
TaskIcon.Bell,
|
||||
TaskIcon.Clock,
|
||||
TaskIcon.Image,
|
||||
]
|
||||
|
||||
|
||||
export function TaskEditor({t, className, editorHook: {input, setInput, task, setTask}}: {t: TFunction, className?: string, editorHook: ReturnType<typeof useTaskEditor>}) {
|
||||
export function TaskEditor({t, className, editorHook: {input, setInput, task, setTask}}: { t: TFunction, className?: string, editorHook: ReturnType<typeof useTaskEditor> }) {
|
||||
const {isReady, sendRequest} = useBoardConsumer()
|
||||
|
||||
|
||||
const nextIcon = useCallback((e: SyntheticEvent<HTMLButtonElement>) => {
|
||||
if("key" in e && typeof e["key"] === "string") {
|
||||
if(![" "].includes(e.key)) {
|
||||
return;
|
||||
return
|
||||
}
|
||||
}
|
||||
e.preventDefault()
|
||||
e.stopPropagation()
|
||||
let index = ICON_SEQUENCE.indexOf(task.icon) + 1;
|
||||
if(index === ICON_SEQUENCE.length) index = 0;
|
||||
setTask({...task, icon: ICON_SEQUENCE[index]})
|
||||
setTask({...task, icon: ICONS[Math.floor(Math.random() * ICONS.length)]})
|
||||
}, [task])
|
||||
|
||||
|
||||
const submitTask = useCallback((e: SyntheticEvent<HTMLInputElement>) => {
|
||||
e.preventDefault()
|
||||
e.stopPropagation()
|
||||
if(task.text === "") return
|
||||
if(task.text === "") {
|
||||
return
|
||||
}
|
||||
sendRequest({"Task": [null, task]})
|
||||
setInput(taskToString({...task, text: ""}))
|
||||
}, [sendRequest, task, setInput])
|
||||
|
||||
if(!isReady) return null
|
||||
|
||||
|
||||
if(!isReady) {
|
||||
return null
|
||||
}
|
||||
|
||||
return (
|
||||
<div
|
||||
className={cn(className, style.taskEditorContainer)}
|
||||
|
@ -70,7 +47,7 @@ export function TaskEditor({t, className, editorHook: {input, setInput, task, se
|
|||
<TaskContainer
|
||||
role={"form"}
|
||||
importance={task.importance}
|
||||
priority={task.priority}
|
||||
deadline={task.deadline}
|
||||
status={TaskSimplifiedStatus.NonExistent}
|
||||
onSubmit={submitTask}
|
||||
>
|
||||
|
|
|
@ -1,38 +1,13 @@
|
|||
import {TaskIcon} from "@/app/[lang]/board/[board]/(api)/(task)"
|
||||
import {TaskIconComponent} from "@/app/[lang]/board/[board]/(page)/(task)/TaskIconComponent"
|
||||
import {TaskSimplifiedStatus} from "@/app/[lang]/board/[board]/(page)/(task)/TaskSimplifiedStatus"
|
||||
import {TFunction} from "i18next"
|
||||
import {SyntheticEvent} from "react"
|
||||
|
||||
|
||||
const ICON_TO_KEY = {
|
||||
[TaskIcon.Bookmark]: "taskIconBookmark",
|
||||
[TaskIcon.Circle]: "taskIconCircle",
|
||||
[TaskIcon.Square]: "taskIconSquare",
|
||||
[TaskIcon.Heart]: "taskIconHeart",
|
||||
[TaskIcon.Star]: "taskIconStar",
|
||||
[TaskIcon.Sun]: "taskIconSun",
|
||||
[TaskIcon.Moon]: "taskIconMoon",
|
||||
[TaskIcon.Eye]: "taskIconEye",
|
||||
[TaskIcon.Hand]: "taskIconHand",
|
||||
[TaskIcon.Handshake]: "taskIconHandshake",
|
||||
[TaskIcon.FaceSmile]: "taskIconFaceSmile",
|
||||
[TaskIcon.User]: "taskIconUser",
|
||||
[TaskIcon.Comment]: "taskIconComment",
|
||||
[TaskIcon.Envelope]: "taskIconEnvelope",
|
||||
[TaskIcon.File]: "taskIconFile",
|
||||
[TaskIcon.PaperPlane]: "taskIconPaperPlane",
|
||||
[TaskIcon.Building]: "taskIconBuilding",
|
||||
[TaskIcon.Flag]: "taskIconFlag",
|
||||
[TaskIcon.Bell]: "taskIconBell",
|
||||
[TaskIcon.Clock]: "taskIconClock",
|
||||
[TaskIcon.Image]: "taskIconImage",
|
||||
}
|
||||
|
||||
export function TaskEditorIcon({t, icon, nextIcon}: {t: TFunction, icon: TaskIcon, nextIcon: (e: SyntheticEvent<HTMLButtonElement>) => void}) {
|
||||
export function TaskEditorIcon({t, icon, nextIcon}: {t: TFunction, icon: string, nextIcon: (e: SyntheticEvent<HTMLButtonElement>) => void}) {
|
||||
return (
|
||||
<TaskIconComponent
|
||||
title={t(ICON_TO_KEY[icon])}
|
||||
title={icon}
|
||||
icon={icon}
|
||||
status={TaskSimplifiedStatus.NonExistent}
|
||||
onInteract={nextIcon}
|
||||
|
|
|
@ -0,0 +1,6 @@
|
|||
export const DEADLINE_GLYPH_START = "["
|
||||
export const DEADLINE_GLYPH_END = "]"
|
||||
|
||||
export const DEADLINE_GLYPH_RE = /\[(.+?)]\s?/
|
||||
|
||||
export const DEADLINE_DEFAULT = null
|
|
@ -1,8 +1,5 @@
|
|||
import {TaskIcon} from "@/app/[lang]/board/[board]/(api)/(task)"
|
||||
|
||||
|
||||
export const ICON_GLYPH = "#"
|
||||
|
||||
export const ICON_GLYPH_RE = /#([A-Za-z]+)\s?/
|
||||
export const ICON_GLYPH_RE = /#([A-Za-z0-9-]+)\s?/
|
||||
|
||||
export const ICON_DEFAULT = TaskIcon.Circle
|
||||
export const ICON_DEFAULT = "Circle"
|
||||
|
|
|
@ -1,8 +0,0 @@
|
|||
import {TaskPriority} from "@/app/[lang]/board/[board]/(api)/(task)"
|
||||
|
||||
|
||||
export const PRIORITY_GLYPH = "/"
|
||||
|
||||
export const PRIORITY_GLYPH_RE = /\/([1-5])\s?/
|
||||
|
||||
export const PRIORITY_DEFAULT = TaskPriority.Normal
|
|
@ -1,8 +1,12 @@
|
|||
import {Task, TaskIcon, TaskImportance, TaskPriority} from "@/app/[lang]/board/[board]/(api)/(task)"
|
||||
import {ICON_GLYPH_RE} from "@/app/[lang]/board/[board]/(page)/(edit)/icon"
|
||||
import {Task, TaskImportance} from "@/app/[lang]/board/[board]/(api)/(task)"
|
||||
import {DEADLINE_GLYPH_RE} from "@/app/[lang]/board/[board]/(page)/(edit)/deadline"
|
||||
import {ICON_DEFAULT, ICON_GLYPH_RE} from "@/app/[lang]/board/[board]/(page)/(edit)/icon"
|
||||
import {IMPORTANCE_GLYPH_RE} from "@/app/[lang]/board/[board]/(page)/(edit)/importance"
|
||||
import {PRIORITY_GLYPH_RE} from "@/app/[lang]/board/[board]/(page)/(edit)/priority"
|
||||
import {default as dateParser} from "any-date-parser"
|
||||
|
||||
// ahhh i love typescript shenanigans
|
||||
// @ts-ignore
|
||||
const DATE_FROM_STRING = dateParser.fromString;
|
||||
|
||||
const VALUE_TO_TASK_IMPORTANCE = {
|
||||
"1": TaskImportance.Highest,
|
||||
|
@ -12,61 +16,28 @@ const VALUE_TO_TASK_IMPORTANCE = {
|
|||
"5": TaskImportance.Lowest,
|
||||
}
|
||||
|
||||
const VALUE_TO_TASK_PRIORITY = {
|
||||
"1": TaskPriority.Highest,
|
||||
"2": TaskPriority.High,
|
||||
"3": TaskPriority.Normal,
|
||||
"4": TaskPriority.Low,
|
||||
"5": TaskPriority.Lowest,
|
||||
}
|
||||
|
||||
const VALUE_TO_TASK_ICON = {
|
||||
"bookmark": TaskIcon.Bookmark,
|
||||
"circle": TaskIcon.Circle,
|
||||
"square": TaskIcon.Square,
|
||||
"heart": TaskIcon.Heart,
|
||||
"star": TaskIcon.Star,
|
||||
"sun": TaskIcon.Sun,
|
||||
"moon": TaskIcon.Moon,
|
||||
"eye": TaskIcon.Eye,
|
||||
"hand": TaskIcon.Hand,
|
||||
"handshake": TaskIcon.Handshake,
|
||||
"facesmile": TaskIcon.FaceSmile,
|
||||
"smile": TaskIcon.FaceSmile,
|
||||
"user": TaskIcon.User,
|
||||
"comment": TaskIcon.Comment,
|
||||
"envelope": TaskIcon.Envelope,
|
||||
"file": TaskIcon.File,
|
||||
"paperplane": TaskIcon.PaperPlane,
|
||||
"plane": TaskIcon.PaperPlane,
|
||||
"building": TaskIcon.Building,
|
||||
"flag": TaskIcon.Flag,
|
||||
"bell": TaskIcon.Bell,
|
||||
"clock": TaskIcon.Clock,
|
||||
"image": TaskIcon.Image,
|
||||
}
|
||||
|
||||
export function stringToTask(text: string): Task {
|
||||
const priorityMatch = PRIORITY_GLYPH_RE.exec(text)
|
||||
export function stringToTask(text: string, lang: string): Task {
|
||||
const importanceMatch = IMPORTANCE_GLYPH_RE.exec(text)
|
||||
const iconMatch = ICON_GLYPH_RE.exec(text)
|
||||
const deadlineMatch = DEADLINE_GLYPH_RE.exec(text)
|
||||
|
||||
const priority: TaskPriority = VALUE_TO_TASK_PRIORITY[priorityMatch?.[1]?.trim() as "1"|"2"|"3"|"4"|"5" ?? "3"]
|
||||
const importance: TaskImportance = VALUE_TO_TASK_IMPORTANCE[importanceMatch?.[1]?.trim() as "1"|"2"|"3"|"4"|"5" ?? "3"]
|
||||
// @ts-ignore
|
||||
const icon: TaskIcon = VALUE_TO_TASK_ICON[iconMatch?.[1]?.toLowerCase()?.trim()] ?? TaskIcon.Circle
|
||||
const icon: string = iconMatch?.[1]?.trim() ?? ICON_DEFAULT
|
||||
const deadlineGroup: string | undefined = deadlineMatch?.[1]?.trim()
|
||||
const deadlineDate: Date | undefined = deadlineGroup === undefined ? undefined : DATE_FROM_STRING(deadlineGroup, lang) ?? undefined
|
||||
const deadline: number | null = (deadlineDate?.getTime?.()) ?? null
|
||||
|
||||
// TODO: Splice so the regexes aren't executed twice
|
||||
text = text.replace(PRIORITY_GLYPH_RE, "")
|
||||
text = text.replace(IMPORTANCE_GLYPH_RE, "")
|
||||
text = text.replace(ICON_GLYPH_RE, "")
|
||||
text = text.replace(DEADLINE_GLYPH_RE, "")
|
||||
text = text.trim()
|
||||
|
||||
return {
|
||||
text,
|
||||
priority,
|
||||
importance,
|
||||
icon,
|
||||
deadline,
|
||||
created_on: + new Date(),
|
||||
started_on: null,
|
||||
completed_on: null,
|
||||
|
|
|
@ -1,7 +1,7 @@
|
|||
import {Task, TaskImportance, TaskPriority} from "@/app/[lang]/board/[board]/(api)/(task)"
|
||||
import {Task, TaskImportance} from "@/app/[lang]/board/[board]/(api)/(task)"
|
||||
import {DEADLINE_DEFAULT, DEADLINE_GLYPH_END, DEADLINE_GLYPH_START} from "@/app/[lang]/board/[board]/(page)/(edit)/deadline"
|
||||
import {ICON_DEFAULT, ICON_GLYPH} from "@/app/[lang]/board/[board]/(page)/(edit)/icon"
|
||||
import {IMPORTANCE_DEFAULT, IMPORTANCE_GLYPH} from "@/app/[lang]/board/[board]/(page)/(edit)/importance"
|
||||
import {PRIORITY_DEFAULT, PRIORITY_GLYPH} from "@/app/[lang]/board/[board]/(page)/(edit)/priority"
|
||||
|
||||
|
||||
const TASK_IMPORTANCE_TO_VALUE = {
|
||||
|
@ -12,16 +12,24 @@ const TASK_IMPORTANCE_TO_VALUE = {
|
|||
[TaskImportance.Lowest]: "5",
|
||||
}
|
||||
|
||||
const TASK_PRIORITY_TO_VALUE = {
|
||||
[TaskPriority.Highest]: "1",
|
||||
[TaskPriority.High]: "2",
|
||||
[TaskPriority.Normal]: "3",
|
||||
[TaskPriority.Low]: "4",
|
||||
[TaskPriority.Lowest]: "5",
|
||||
}
|
||||
|
||||
export function taskToString(t: Task): string {
|
||||
export function taskToString(t: Task, lang: string): string {
|
||||
const intlDate = Intl.DateTimeFormat(lang, {
|
||||
year: "numeric",
|
||||
month: "short",
|
||||
day: "2-digit",
|
||||
hour: "2-digit",
|
||||
minute: "2-digit",
|
||||
second: "2-digit",
|
||||
})
|
||||
|
||||
let s = ""
|
||||
|
||||
if(t.deadline !== DEADLINE_DEFAULT) {
|
||||
s += DEADLINE_GLYPH_START
|
||||
s += intlDate.format(new Date(t.deadline))
|
||||
s += DEADLINE_GLYPH_END
|
||||
s += " "
|
||||
}
|
||||
|
||||
if(t.icon !== ICON_DEFAULT) {
|
||||
s += ICON_GLYPH
|
||||
|
@ -35,12 +43,6 @@ export function taskToString(t: Task): string {
|
|||
s += " "
|
||||
}
|
||||
|
||||
if(t.priority !== PRIORITY_DEFAULT) {
|
||||
s += PRIORITY_GLYPH
|
||||
s += TASK_PRIORITY_TO_VALUE[t.priority]
|
||||
s += " "
|
||||
}
|
||||
|
||||
s += t.text
|
||||
|
||||
return s
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
import {useBoardConsumer} from "@/app/[lang]/board/[board]/(layout)/(contextBoard)"
|
||||
import style from "@/app/[lang]/board/[board]/(page)/(header)/BoardHeaderButtons.module.css"
|
||||
import {faUsers} from "@fortawesome/free-solid-svg-icons"
|
||||
import {fas} from "@awesome.me/kit-dfe340c874/icons"
|
||||
import {FontAwesomeIcon} from "@fortawesome/react-fontawesome"
|
||||
import cn from "classnames"
|
||||
import {TFunction} from "i18next"
|
||||
|
@ -16,7 +16,7 @@ export function ConnectedClientsButton({t}: {t: TFunction}) {
|
|||
title={t("privacyButtonTitle")}
|
||||
className={cn(style.block, style.singleBlock)}
|
||||
>
|
||||
<FontAwesomeIcon icon={faUsers} size={"2xs"}/>
|
||||
<FontAwesomeIcon icon={fas.faUsers} size={"2xs"}/>
|
||||
|
||||
{clients.length}
|
||||
</div>
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
import {useBoardConsumer} from "@/app/[lang]/board/[board]/(layout)/(contextBoard)"
|
||||
import style from "@/app/[lang]/board/[board]/(page)/(header)/BoardHeaderButtons.module.css"
|
||||
import {faObjectGroup} from "@fortawesome/free-solid-svg-icons"
|
||||
import {fas} from "@awesome.me/kit-dfe340c874/icons"
|
||||
import {FontAwesomeIcon} from "@fortawesome/react-fontawesome"
|
||||
import cn from "classnames"
|
||||
import {TFunction} from "i18next"
|
||||
|
@ -17,7 +17,7 @@ export function CycleGroupingButton({t, next}: {t: TFunction, next: () => void})
|
|||
onClick={next}
|
||||
className={cn(style.block, style.singleBlock)}
|
||||
>
|
||||
<FontAwesomeIcon icon={faObjectGroup}/>
|
||||
<FontAwesomeIcon icon={fas.faObjectGroup}/>
|
||||
</button>
|
||||
)
|
||||
}
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
import {useBoardConsumer} from "@/app/[lang]/board/[board]/(layout)/(contextBoard)"
|
||||
import style from "@/app/[lang]/board/[board]/(page)/(header)/BoardHeaderButtons.module.css"
|
||||
import {faArrowDownWideShort} from "@fortawesome/free-solid-svg-icons"
|
||||
import {fas} from "@awesome.me/kit-dfe340c874/icons"
|
||||
import {FontAwesomeIcon} from "@fortawesome/react-fontawesome"
|
||||
import cn from "classnames"
|
||||
import {TFunction} from "i18next"
|
||||
|
@ -17,7 +17,7 @@ export function CycleSortingButton({t, next}: {t: TFunction, next: () => void})
|
|||
onClick={next}
|
||||
className={cn(style.block, style.singleBlock)}
|
||||
>
|
||||
<FontAwesomeIcon icon={faArrowDownWideShort}/>
|
||||
<FontAwesomeIcon icon={fas.faArrowDownWideShort}/>
|
||||
</button>
|
||||
)
|
||||
}
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
import style from "@/app/[lang]/board/[board]/(page)/(header)/BoardHeaderButtons.module.css"
|
||||
import {faHouse} from "@fortawesome/free-solid-svg-icons"
|
||||
import {fas} from "@awesome.me/kit-dfe340c874/icons"
|
||||
import {FontAwesomeIcon} from "@fortawesome/react-fontawesome"
|
||||
import cn from "classnames"
|
||||
import {TFunction} from "i18next"
|
||||
|
@ -17,7 +17,7 @@ export function NavigateHomeButton({t}: {t: TFunction}) {
|
|||
onClick={goHome}
|
||||
className={cn(style.block, style.singleBlock)}
|
||||
>
|
||||
<FontAwesomeIcon icon={faHouse}/>
|
||||
<FontAwesomeIcon icon={fas.faHouse}/>
|
||||
</button>
|
||||
)
|
||||
}
|
||||
|
|
|
@ -1,7 +1,7 @@
|
|||
import {useBoardConsumer} from "@/app/[lang]/board/[board]/(layout)/(contextBoard)"
|
||||
import style from "@/app/[lang]/board/[board]/(page)/(header)/BoardHeaderButtons.module.css"
|
||||
import {useBoardMetadataEditor} from "@/app/[lang]/board/[board]/(page)/useBoardMetadataEditor"
|
||||
import {faFloppyDisk, faPencil} from "@fortawesome/free-solid-svg-icons"
|
||||
import {fas} from "@awesome.me/kit-dfe340c874/icons"
|
||||
import {FontAwesomeIcon} from "@fortawesome/react-fontawesome"
|
||||
import cn from "classnames"
|
||||
import {TFunction} from "i18next"
|
||||
|
@ -19,7 +19,7 @@ export function ToggleEditingButton({t, metadataHook}: {t: TFunction, metadataHo
|
|||
onClick={metadataHook.toggleEditingMetadata}
|
||||
className={cn(style.block, style.singleBlock)}
|
||||
>
|
||||
<FontAwesomeIcon icon={metadataHook.isEditingMetadata ? faFloppyDisk : faPencil}/>
|
||||
<FontAwesomeIcon icon={fas[metadataHook.isEditingMetadata ? "faFloppyDisk" : "faPencil"]}/>
|
||||
</button>
|
||||
)
|
||||
}
|
||||
|
|
|
@ -1,7 +1,7 @@
|
|||
import {LockBoardRequest} from "@/app/[lang]/board/[board]/(api)/(request)"
|
||||
import {useBoardConsumer} from "@/app/[lang]/board/[board]/(layout)/(contextBoard)"
|
||||
import style from "@/app/[lang]/board/[board]/(page)/(header)/BoardHeaderButtons.module.css"
|
||||
import {faLock, faLockOpen} from "@fortawesome/free-solid-svg-icons"
|
||||
import {fas} from "@awesome.me/kit-dfe340c874/icons"
|
||||
import {FontAwesomeIcon} from "@fortawesome/react-fontawesome"
|
||||
import cn from "classnames"
|
||||
import {TFunction} from "i18next"
|
||||
|
@ -25,7 +25,7 @@ export function ToggleLockedButton({t}: {t: TFunction}) {
|
|||
onClick={toggleLock}
|
||||
className={cn(style.block, style.singleBlock)}
|
||||
>
|
||||
<FontAwesomeIcon icon={locked ? faLock : faLockOpen}/>
|
||||
<FontAwesomeIcon icon={fas[locked ? "faLock" : "faLockOpen"]}/>
|
||||
</button>
|
||||
)
|
||||
}
|
||||
|
|
|
@ -1,8 +1,9 @@
|
|||
"use client";
|
||||
|
||||
import {useStarredConsumer} from "@/app/[lang]/(layout)/(contextStarred)"
|
||||
import {useBoardConsumer} from "@/app/[lang]/board/[board]/(layout)/(contextBoard)"
|
||||
import style from "@/app/[lang]/board/[board]/(page)/(header)/BoardHeaderButtons.module.css"
|
||||
import {faStar as faStarRegular} from "@fortawesome/free-regular-svg-icons"
|
||||
import {faStar as faStarSolid} from "@fortawesome/free-solid-svg-icons"
|
||||
import {far, fas} from "@awesome.me/kit-dfe340c874/icons"
|
||||
import {FontAwesomeIcon} from "@fortawesome/react-fontawesome"
|
||||
import cn from "classnames"
|
||||
import {TFunction} from "i18next"
|
||||
|
@ -19,7 +20,7 @@ export function ToggleStarredButton({t}: {t: TFunction}) {
|
|||
onClick={() => toggleStarred(boardName)}
|
||||
className={cn(style.block, style.singleBlock)}
|
||||
>
|
||||
<FontAwesomeIcon icon={thisIsStarred ? faStarSolid : faStarRegular}/>
|
||||
<FontAwesomeIcon icon={(thisIsStarred ? fas : far)["faStar"]}/>
|
||||
</button>
|
||||
)
|
||||
}
|
||||
|
|
|
@ -1,7 +1,7 @@
|
|||
import {TrimBoardRequest} from "@/app/[lang]/board/[board]/(api)/(request)"
|
||||
import {useBoardConsumer} from "@/app/[lang]/board/[board]/(layout)/(contextBoard)"
|
||||
import style from "@/app/[lang]/board/[board]/(page)/(header)/BoardHeaderButtons.module.css"
|
||||
import {faScissors} from "@fortawesome/free-solid-svg-icons"
|
||||
import {fas} from "@awesome.me/kit-dfe340c874/icons"
|
||||
import {FontAwesomeIcon} from "@fortawesome/react-fontawesome"
|
||||
import cn from "classnames"
|
||||
import {TFunction} from "i18next"
|
||||
|
@ -25,7 +25,7 @@ export function TrimButton({t}: {t: TFunction}) {
|
|||
onClick={requestTrim}
|
||||
className={cn(style.block, style.singleBlock)}
|
||||
>
|
||||
<FontAwesomeIcon icon={faScissors}/>
|
||||
<FontAwesomeIcon icon={fas.faScissors}/>
|
||||
</button>
|
||||
)
|
||||
}
|
||||
|
|
|
@ -1,4 +1,4 @@
|
|||
import {IconDefinition} from "@fortawesome/free-solid-svg-icons"
|
||||
import {IconDefinition} from "@fortawesome/fontawesome-svg-core"
|
||||
import {FontAwesomeIcon} from "@fortawesome/react-fontawesome"
|
||||
import cn from "classnames"
|
||||
import {SyntheticEvent} from "react"
|
||||
|
|
|
@ -45,31 +45,39 @@
|
|||
font-weight: 200;
|
||||
}
|
||||
|
||||
.taskPriorityHighest {
|
||||
border: 4px solid hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness) / 0.45);
|
||||
.taskDeadlineHour {
|
||||
border: 4px hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness) / 0.45);
|
||||
padding: 4px;
|
||||
}
|
||||
|
||||
.taskPriorityHigh {
|
||||
border: 3px solid hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness) / 0.25);
|
||||
.taskDeadlineDay {
|
||||
border: 3px hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness) / 0.25);
|
||||
padding: 5px;
|
||||
}
|
||||
|
||||
.taskPriorityNormal {
|
||||
border: 2px solid hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness) / 0.15);
|
||||
.taskDeadlineWeek {
|
||||
border: 2px hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness) / 0.15);
|
||||
padding: 6px;
|
||||
}
|
||||
|
||||
.taskPriorityLow {
|
||||
border: 1px solid hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness) / 0.15);
|
||||
.taskDeadlineMonth {
|
||||
border: 1px hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness) / 0.15);
|
||||
padding: 7px;
|
||||
}
|
||||
|
||||
.taskPriorityLowest {
|
||||
.taskDeadlineNone {
|
||||
border: 0;
|
||||
padding: 8px;
|
||||
}
|
||||
|
||||
.taskDeadlineIncoming {
|
||||
border-style: solid;
|
||||
}
|
||||
|
||||
.taskDeadlinePast {
|
||||
border-style: dashed;
|
||||
}
|
||||
|
||||
@keyframes inProgress {
|
||||
0%, 100% {
|
||||
opacity: 0.4;
|
||||
|
|
|
@ -1,4 +1,4 @@
|
|||
import {TaskImportance, TaskPriority} from "@/app/[lang]/board/[board]/(api)/(task)"
|
||||
import {TaskImportance} from "@/app/[lang]/board/[board]/(api)/(task)"
|
||||
import {TaskSimplifiedStatus} from "@/app/[lang]/board/[board]/(page)/(task)/TaskSimplifiedStatus"
|
||||
import cn from "classnames"
|
||||
import {ComponentPropsWithoutRef} from "react"
|
||||
|
@ -9,12 +9,16 @@ export type TaskContainerProps = {
|
|||
className?: string,
|
||||
role: "article" | "form",
|
||||
importance: TaskImportance,
|
||||
priority: TaskPriority,
|
||||
deadline: number | null,
|
||||
status: TaskSimplifiedStatus,
|
||||
} & ComponentPropsWithoutRef<"article">
|
||||
|
||||
|
||||
export function TaskContainer({role, className, importance, priority, status, ...props}: TaskContainerProps) {
|
||||
export function TaskContainer({role, className, importance, deadline, status, ...props}: TaskContainerProps) {
|
||||
const now = + new Date();
|
||||
const delta = deadline === null ? null : deadline - now
|
||||
const deltaAbs = delta === null ? null : Math.abs(delta)
|
||||
|
||||
const fullProps = {
|
||||
className: cn({
|
||||
"panel": true,
|
||||
|
@ -25,11 +29,13 @@ export function TaskContainer({role, className, importance, priority, status, ..
|
|||
[style.taskImportanceNormal]: importance === TaskImportance.Normal,
|
||||
[style.taskImportanceLow]: importance === TaskImportance.Low,
|
||||
[style.taskImportanceLowest]: importance === TaskImportance.Lowest,
|
||||
[style.taskPriorityHighest]: priority === TaskPriority.Highest,
|
||||
[style.taskPriorityHigh]: priority === TaskPriority.High,
|
||||
[style.taskPriorityNormal]: priority === TaskPriority.Normal,
|
||||
[style.taskPriorityLow]: priority === TaskPriority.Low,
|
||||
[style.taskPriorityLowest]: priority === TaskPriority.Lowest,
|
||||
[style.taskDeadlineNone]: deadline === null,
|
||||
[style.taskDeadlineHour]: deltaAbs !== null && deltaAbs < 60 * 60 * 1000,
|
||||
[style.taskDeadlineDay]: deltaAbs !== null && 60 * 60 * 1000 <= deltaAbs && deltaAbs < 24 * 60 * 60 * 1000,
|
||||
[style.taskDeadlineWeek]: deltaAbs !== null && 24 * 60 * 60 * 1000 <= deltaAbs && deltaAbs < 7 * 24 * 60 * 60 * 1000,
|
||||
[style.taskDeadlineMonth]: deltaAbs !== null && deltaAbs >= 7 * 24 * 60 * 60 * 1000,
|
||||
[style.taskDeadlineIncoming]: delta !== null && delta > 0,
|
||||
[style.taskDeadlinePast]: delta !== null && delta < 0,
|
||||
[style.taskStatusNonExistent]: status === TaskSimplifiedStatus.NonExistent,
|
||||
[style.taskStatusUnfinished]: status === TaskSimplifiedStatus.Unfinished,
|
||||
[style.taskStatusInProgress]: status === TaskSimplifiedStatus.InProgress,
|
||||
|
|
|
@ -2,3 +2,7 @@
|
|||
border-radius: var(--b-border-radius);
|
||||
flex-grow: 1;
|
||||
}
|
||||
|
||||
.taskDescriptionSource {
|
||||
font-family: monospace;
|
||||
}
|
||||
|
|
|
@ -4,14 +4,16 @@ import style from "./TaskDescription.module.css"
|
|||
|
||||
type TaskDescriptionProps = {
|
||||
className?: string,
|
||||
isSource?: boolean,
|
||||
text: string,
|
||||
}
|
||||
|
||||
export function TaskDescription({className, text}: TaskDescriptionProps) {
|
||||
export function TaskDescription({className, isSource, text}: TaskDescriptionProps) {
|
||||
return (
|
||||
<div className={cn({
|
||||
"taskDescription": true,
|
||||
[style.taskDescription]: true,
|
||||
[style.taskDescriptionSource]: isSource,
|
||||
}, className)} tabIndex={0}>
|
||||
{text}
|
||||
</div>
|
||||
|
|
|
@ -1,5 +1,6 @@
|
|||
import {TASK_ICON_TO_FONTAWESOME_REGULAR, TASK_ICON_TO_FONTAWESOME_SOLID, TaskIcon} from "@/app/[lang]/board/[board]/(api)/(task)"
|
||||
import {TaskSimplifiedStatus} from "@/app/[lang]/board/[board]/(page)/(task)/TaskSimplifiedStatus"
|
||||
import {fal, far, fas} from "@awesome.me/kit-dfe340c874/icons"
|
||||
import {IconPack} from "@fortawesome/fontawesome-svg-core"
|
||||
import {FontAwesomeIcon} from "@fortawesome/react-fontawesome"
|
||||
import cn from "classnames"
|
||||
import {SyntheticEvent} from "react"
|
||||
|
@ -9,11 +10,18 @@ import style from "./TaskIconComponent.module.css"
|
|||
type TaskIconProps = {
|
||||
className?: string,
|
||||
title: string,
|
||||
icon: TaskIcon,
|
||||
icon: string,
|
||||
status: TaskSimplifiedStatus,
|
||||
onInteract?: (e: SyntheticEvent<HTMLButtonElement>) => void,
|
||||
}
|
||||
|
||||
const STATUS_TO_PREFIX: {[t in TaskSimplifiedStatus]: IconPack} = {
|
||||
[TaskSimplifiedStatus.Unfinished]: fal,
|
||||
[TaskSimplifiedStatus.InProgress]: far,
|
||||
[TaskSimplifiedStatus.Complete]: fas,
|
||||
[TaskSimplifiedStatus.Journaled]: fas,
|
||||
[TaskSimplifiedStatus.NonExistent]: far,
|
||||
}
|
||||
|
||||
export function TaskIconComponent({className, title, icon, status, onInteract}: TaskIconProps) {
|
||||
const clickable = !!onInteract;
|
||||
|
@ -32,7 +40,7 @@ export function TaskIconComponent({className, title, icon, status, onInteract}:
|
|||
>
|
||||
<FontAwesomeIcon
|
||||
size={"lg"}
|
||||
icon={[TaskSimplifiedStatus.Complete, TaskSimplifiedStatus.Journaled].includes(status) ? TASK_ICON_TO_FONTAWESOME_SOLID[icon] : TASK_ICON_TO_FONTAWESOME_REGULAR[icon]}
|
||||
icon={STATUS_TO_PREFIX[status][`fa${icon}`]}
|
||||
beatFade={status === TaskSimplifiedStatus.InProgress}
|
||||
/>
|
||||
</button>
|
||||
|
|
|
@ -1,8 +1,9 @@
|
|||
import {ColumningMode} from "@/app/[lang]/board/[board]/(page)/(view)/(columning)/ColumningMode"
|
||||
import {faTableColumns, faTableList} from "@fortawesome/free-solid-svg-icons"
|
||||
import {fas} from "@awesome.me/kit-dfe340c874/icons"
|
||||
import {IconDefinition} from "@fortawesome/fontawesome-svg-core"
|
||||
|
||||
|
||||
export const COLUMNING_MODE_TO_ICON = {
|
||||
[ColumningMode.SingleColumn]: faTableList,
|
||||
[ColumningMode.MultiColumn]: faTableColumns,
|
||||
export const COLUMNING_MODE_TO_ICON: {[m in ColumningMode]: IconDefinition} = {
|
||||
[ColumningMode.SingleColumn]: fas.faTableList,
|
||||
[ColumningMode.MultiColumn]: fas.faTableColumns,
|
||||
}
|
||||
|
|
|
@ -1,6 +1,5 @@
|
|||
export enum GroupingMode {
|
||||
ByImportance,
|
||||
ByPriority,
|
||||
ByStatus,
|
||||
ByIcon,
|
||||
Journal,
|
||||
|
|
|
@ -1,4 +1,5 @@
|
|||
import {TaskIcon, TaskImportance, TaskPriority} from "@/app/[lang]/board/[board]/(api)/(task)"
|
||||
import {TaskImportance} from "@/app/[lang]/board/[board]/(api)/(task)"
|
||||
import {ICONS} from "@/app/[lang]/board/[board]/(api)/(task)/TaskIcon"
|
||||
import {GroupingMode} from "@/app/[lang]/board/[board]/(page)/(view)/(grouping)/GroupingMode"
|
||||
import {TaskGroup} from "@/app/[lang]/board/[board]/(page)/(view)/(grouping)/TaskGroup"
|
||||
|
||||
|
@ -11,14 +12,6 @@ const TASK_IMPORTANCE_TO_VALUE = {
|
|||
[TaskImportance.Lowest]: 5,
|
||||
}
|
||||
|
||||
const TASK_PRIORITY_TO_VALUE = {
|
||||
[TaskPriority.Highest]: 1,
|
||||
[TaskPriority.High]: 2,
|
||||
[TaskPriority.Normal]: 3,
|
||||
[TaskPriority.Low]: 4,
|
||||
[TaskPriority.Lowest]: 5,
|
||||
}
|
||||
|
||||
const TASK_STATUS_TO_VALUE = {
|
||||
"Journaled": 3,
|
||||
"Complete": 2,
|
||||
|
@ -26,45 +19,18 @@ const TASK_STATUS_TO_VALUE = {
|
|||
"Unfinished": 0,
|
||||
}
|
||||
|
||||
const TASK_ICON_TO_VALUE = {
|
||||
[TaskIcon.Bookmark]: 1,
|
||||
[TaskIcon.Circle]: 2,
|
||||
[TaskIcon.Square]: 3,
|
||||
[TaskIcon.Heart]: 4,
|
||||
[TaskIcon.Star]: 5,
|
||||
[TaskIcon.Sun]: 6,
|
||||
[TaskIcon.Moon]: 7,
|
||||
[TaskIcon.Eye]: 8,
|
||||
[TaskIcon.Hand]: 9,
|
||||
[TaskIcon.Handshake]: 10,
|
||||
[TaskIcon.FaceSmile]: 11,
|
||||
[TaskIcon.User]: 12,
|
||||
[TaskIcon.Comment]: 13,
|
||||
[TaskIcon.Envelope]: 14,
|
||||
[TaskIcon.File]: 15,
|
||||
[TaskIcon.PaperPlane]: 16,
|
||||
[TaskIcon.Building]: 17,
|
||||
[TaskIcon.Flag]: 18,
|
||||
[TaskIcon.Bell]: 19,
|
||||
[TaskIcon.Clock]: 20,
|
||||
[TaskIcon.Image]: 21,
|
||||
}
|
||||
|
||||
export const GROUPING_MODE_TO_GROUP_SORTER_FUNCTION = {
|
||||
[GroupingMode.ByImportance]: function sortGroupsByImportance(a: TaskGroup<TaskImportance>, b: TaskGroup<TaskImportance>): number {
|
||||
return TASK_IMPORTANCE_TO_VALUE[a.k] - TASK_IMPORTANCE_TO_VALUE[b.k]
|
||||
},
|
||||
[GroupingMode.ByPriority]: function sortGroupsByPriority(a: TaskGroup<TaskPriority>, b: TaskGroup<TaskPriority>): number {
|
||||
return TASK_PRIORITY_TO_VALUE[a.k] - TASK_PRIORITY_TO_VALUE[b.k]
|
||||
},
|
||||
[GroupingMode.ByStatus]: function sortGroupsByStatus(a: TaskGroup<string>, b: TaskGroup<string>): number {
|
||||
// @ts-ignore
|
||||
return TASK_STATUS_TO_VALUE[a.k] - TASK_STATUS_TO_VALUE[b.k]
|
||||
},
|
||||
[GroupingMode.ByIcon]: function sortGroupsByIcon(a: TaskGroup<TaskIcon>, b: TaskGroup<TaskIcon>): number {
|
||||
return TASK_ICON_TO_VALUE[a.k] - TASK_ICON_TO_VALUE[b.k]
|
||||
[GroupingMode.ByIcon]: function sortGroupsByIcon(a: TaskGroup<string>, b: TaskGroup<string>): number {
|
||||
return ICONS.indexOf(a.k as any) - ICONS.indexOf(b.k as any)
|
||||
},
|
||||
[GroupingMode.Journal]: function sortGroupsAlphabetically(a: TaskGroup<TaskIcon>, b: TaskGroup<TaskIcon>): number {
|
||||
[GroupingMode.Journal]: function sortGroupsAlphabetically(a: TaskGroup<string>, b: TaskGroup<string>): number {
|
||||
return b.k.localeCompare(a.k)
|
||||
}
|
||||
}
|
||||
|
|
|
@ -1,24 +1,19 @@
|
|||
import {TaskIcon, TaskImportance, TaskPriority} from "@/app/[lang]/board/[board]/(api)/(task)"
|
||||
import {TaskImportance} from "@/app/[lang]/board/[board]/(api)/(task)"
|
||||
import {TaskWithId} from "@/app/[lang]/board/[board]/(page)/(task)/TaskWithId"
|
||||
import {GroupingMode} from "@/app/[lang]/board/[board]/(page)/(view)/(grouping)/GroupingMode"
|
||||
|
||||
|
||||
export const GROUPING_MODE_TO_TASK_GROUPER_FUNCTION = {
|
||||
[GroupingMode.ByImportance]: function groupTasksByImportance(t: TaskWithId): TaskImportance | null {
|
||||
if(t[1].journaled_on) return null
|
||||
return t[1].importance
|
||||
},
|
||||
[GroupingMode.ByPriority]: function groupTasksByPriority(t: TaskWithId): TaskPriority | null {
|
||||
if(t[1].journaled_on) return null
|
||||
return t[1].priority
|
||||
},
|
||||
[GroupingMode.ByStatus]: function groupTasksByStatus(t: TaskWithId): string | null {
|
||||
if(t[1].journaled_on) return null
|
||||
else if(t[1].completed_on) return "Complete"
|
||||
else if(t[1].started_on) return "InProgress"
|
||||
else return "Unfinished"
|
||||
},
|
||||
[GroupingMode.ByIcon]: function groupTasksByIcon(t: TaskWithId): TaskIcon | null {
|
||||
[GroupingMode.ByIcon]: function groupTasksByIcon(t: TaskWithId): string | null {
|
||||
if(t[1].journaled_on) return null
|
||||
return t[1].icon
|
||||
},
|
||||
|
|
|
@ -1,6 +1,7 @@
|
|||
import {TASK_ICON_TO_FONTAWESOME_REGULAR, TaskIcon, TaskImportance, TaskPriority} from "@/app/[lang]/board/[board]/(api)/(task)"
|
||||
import {TaskImportance} from "@/app/[lang]/board/[board]/(api)/(task)"
|
||||
import style from "@/app/[lang]/board/[board]/(page)/(task)/TaskContainer.module.css"
|
||||
import {GroupingMode} from "@/app/[lang]/board/[board]/(page)/(view)/(grouping)/GroupingMode"
|
||||
import {fas} from "@awesome.me/kit-dfe340c874/icons"
|
||||
import {FontAwesomeIcon} from "@fortawesome/react-fontawesome"
|
||||
import {TFunction} from "i18next"
|
||||
import {ReactNode} from "react"
|
||||
|
@ -48,41 +49,6 @@ export const GROUPING_MODE_TO_TITLE_COMPONENT: {[key in GroupingMode]: (t: Title
|
|||
}
|
||||
},
|
||||
|
||||
[GroupingMode.ByPriority]: function TitleFromPriority({t, k}: { t: TFunction, k: TaskPriority }): ReactNode {
|
||||
switch(k) {
|
||||
case TaskPriority.Highest:
|
||||
return (
|
||||
<span className={style.taskPriorityHighestColumnHeader}>
|
||||
{t("taskPriorityHighest")}
|
||||
</span>
|
||||
)
|
||||
case TaskPriority.High:
|
||||
return (
|
||||
<span className={style.taskPriorityHighColumnHeader}>
|
||||
{t("taskPriorityHigh")}
|
||||
</span>
|
||||
)
|
||||
case TaskPriority.Normal:
|
||||
return (
|
||||
<span className={style.taskPriorityNormalColumnHeader}>
|
||||
{t("taskPriorityNormal")}
|
||||
</span>
|
||||
)
|
||||
case TaskPriority.Low:
|
||||
return (
|
||||
<span className={style.taskPriorityLowColumnHeader}>
|
||||
{t("taskPriorityLow")}
|
||||
</span>
|
||||
)
|
||||
case TaskPriority.Lowest:
|
||||
return (
|
||||
<span className={style.taskPriorityLowestColumnHeader}>
|
||||
{t("taskPriorityLowest")}
|
||||
</span>
|
||||
)
|
||||
}
|
||||
},
|
||||
|
||||
[GroupingMode.ByStatus]: function TitleFromStatus({t, k}: { t: TFunction, k: string }): ReactNode {
|
||||
switch(k) {
|
||||
case "Unfinished":
|
||||
|
@ -106,12 +72,12 @@ export const GROUPING_MODE_TO_TITLE_COMPONENT: {[key in GroupingMode]: (t: Title
|
|||
}
|
||||
},
|
||||
|
||||
[GroupingMode.ByIcon]: function TitleFromIcon({k}: { t: TFunction, k: TaskIcon }): ReactNode {
|
||||
[GroupingMode.ByIcon]: function TitleFromIcon({k}: { t: TFunction, k: string }): ReactNode {
|
||||
return (
|
||||
<span>
|
||||
<FontAwesomeIcon icon={TASK_ICON_TO_FONTAWESOME_REGULAR[k]}/>
|
||||
<FontAwesomeIcon icon={fas[`fa${k}`]}/>
|
||||
|
||||
{TaskIcon[k]}
|
||||
{k}
|
||||
</span>
|
||||
)
|
||||
},
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
export enum SortingMode {
|
||||
ByPriority,
|
||||
ByImportance,
|
||||
ByDeadline,
|
||||
ByIcon,
|
||||
ByText,
|
||||
ByStatus,
|
||||
|
|
|
@ -1,4 +1,5 @@
|
|||
import {TaskIcon, TaskImportance, TaskPriority} from "@/app/[lang]/board/[board]/(api)/(task)"
|
||||
import {TaskImportance} from "@/app/[lang]/board/[board]/(api)/(task)"
|
||||
import {ICONS} from "@/app/[lang]/board/[board]/(api)/(task)/TaskIcon"
|
||||
import {TaskWithId} from "@/app/[lang]/board/[board]/(page)/(task)/TaskWithId"
|
||||
import {SortingMode} from "@/app/[lang]/board/[board]/(page)/(view)/(sorting)/SortingMode"
|
||||
|
||||
|
@ -11,38 +12,6 @@ const TASK_IMPORTANCE_TO_VALUE = {
|
|||
[TaskImportance.Lowest]: 5,
|
||||
}
|
||||
|
||||
const TASK_PRIORITY_TO_VALUE = {
|
||||
[TaskPriority.Highest]: 1,
|
||||
[TaskPriority.High]: 2,
|
||||
[TaskPriority.Normal]: 3,
|
||||
[TaskPriority.Low]: 4,
|
||||
[TaskPriority.Lowest]: 5,
|
||||
}
|
||||
|
||||
const TASK_ICON_TO_VALUE = {
|
||||
[TaskIcon.Bookmark]: 1,
|
||||
[TaskIcon.Circle]: 2,
|
||||
[TaskIcon.Square]: 3,
|
||||
[TaskIcon.Heart]: 4,
|
||||
[TaskIcon.Star]: 5,
|
||||
[TaskIcon.Sun]: 6,
|
||||
[TaskIcon.Moon]: 7,
|
||||
[TaskIcon.Eye]: 8,
|
||||
[TaskIcon.Hand]: 9,
|
||||
[TaskIcon.Handshake]: 10,
|
||||
[TaskIcon.FaceSmile]: 11,
|
||||
[TaskIcon.User]: 12,
|
||||
[TaskIcon.Comment]: 13,
|
||||
[TaskIcon.Envelope]: 14,
|
||||
[TaskIcon.File]: 15,
|
||||
[TaskIcon.PaperPlane]: 16,
|
||||
[TaskIcon.Building]: 17,
|
||||
[TaskIcon.Flag]: 18,
|
||||
[TaskIcon.Bell]: 19,
|
||||
[TaskIcon.Clock]: 20,
|
||||
[TaskIcon.Image]: 21,
|
||||
}
|
||||
|
||||
|
||||
export function getTaskSorter(sortingModes: SortingMode[]) {
|
||||
return (a: TaskWithId, b: TaskWithId) => {
|
||||
|
@ -61,13 +30,13 @@ const SORTING_MODE_TO_SORTING_FUNCTION = {
|
|||
return a[1].text.localeCompare(b[1].text)
|
||||
},
|
||||
[SortingMode.ByIcon]: function sortTasksByIcon(a: TaskWithId, b: TaskWithId) {
|
||||
return TASK_ICON_TO_VALUE[a[1].icon] - TASK_ICON_TO_VALUE[b[1].icon]
|
||||
return ICONS.indexOf(a[1].icon as any) - ICONS.indexOf(b[1].icon as any)
|
||||
},
|
||||
[SortingMode.ByImportance]: function sortTasksByImportance(a: TaskWithId, b: TaskWithId) {
|
||||
return TASK_IMPORTANCE_TO_VALUE[a[1].importance] - TASK_IMPORTANCE_TO_VALUE[b[1].importance]
|
||||
},
|
||||
[SortingMode.ByPriority]: function sortTasksByPriority(a: TaskWithId, b: TaskWithId) {
|
||||
return TASK_PRIORITY_TO_VALUE[a[1].priority] - TASK_PRIORITY_TO_VALUE[b[1].priority]
|
||||
[SortingMode.ByDeadline]: function sortTasksByPriority(a: TaskWithId, b: TaskWithId) {
|
||||
return (a[1].deadline ?? -1) - (b[1].deadline ?? -1)
|
||||
},
|
||||
[SortingMode.ByStatus]: function sortTasksByStatus(a: TaskWithId, b: TaskWithId) {
|
||||
if(a[1].journaled_on && !b[1].journaled_on) return 1;
|
||||
|
|
|
@ -1,5 +1,6 @@
|
|||
import {ModifyTaskBoardRequest} from "@/app/[lang]/board/[board]/(api)/(request)"
|
||||
import {useBoardConsumer} from "@/app/[lang]/board/[board]/(layout)/(contextBoard)"
|
||||
import {taskToString} from "@/app/[lang]/board/[board]/(page)/(edit)/taskToString"
|
||||
import {TaskActions} from "@/app/[lang]/board/[board]/(page)/(task)/TaskActions"
|
||||
import {TaskContainer} from "@/app/[lang]/board/[board]/(page)/(task)/TaskContainer"
|
||||
import {TaskDescription} from "@/app/[lang]/board/[board]/(page)/(task)/TaskDescription"
|
||||
|
@ -12,7 +13,7 @@ import {TFunction} from "i18next"
|
|||
import {Dispatch, KeyboardEvent, PointerEvent, SetStateAction, SyntheticEvent, useCallback, useState} from "react"
|
||||
|
||||
|
||||
export function TaskViewer({t, taskWithId: [id, task], setEditorInput}: {t: TFunction, taskWithId: TaskWithId, setEditorInput: Dispatch<SetStateAction<string>>}) {
|
||||
export function TaskViewer({lang, t, taskWithId: [id, task], setEditorInput}: {lang: string, t: TFunction, taskWithId: TaskWithId, setEditorInput: Dispatch<SetStateAction<string>>}) {
|
||||
const [isFlipped, setFlipped] = useState<boolean>(false)
|
||||
const {sendRequest, boardState: {locked}} = useBoardConsumer()
|
||||
|
||||
|
@ -129,7 +130,7 @@ export function TaskViewer({t, taskWithId: [id, task], setEditorInput}: {t: TFun
|
|||
<TaskContainer
|
||||
role={"article"}
|
||||
importance={task.importance}
|
||||
priority={task.priority}
|
||||
deadline={task.deadline}
|
||||
status={status}
|
||||
onKeyDown={toggleFlipOnKeyDown}
|
||||
onPointerEnter={flipOnPointerEnter}
|
||||
|
@ -138,12 +139,13 @@ export function TaskViewer({t, taskWithId: [id, task], setEditorInput}: {t: TFun
|
|||
>
|
||||
<TaskViewerIcon
|
||||
t={t}
|
||||
icon={task.icon}
|
||||
icon={task.icon as any}
|
||||
status={status}
|
||||
onInteract={status === TaskSimplifiedStatus.Journaled ? undefined : toggleStatus}
|
||||
/>
|
||||
<TaskDescription
|
||||
text={task.text}
|
||||
isSource={isFlipped}
|
||||
text={isFlipped ? taskToString(task, lang) : task.text}
|
||||
/>
|
||||
{sideElements}
|
||||
</TaskContainer>
|
||||
|
|
|
@ -1,4 +1,3 @@
|
|||
import {TaskIcon} from "@/app/[lang]/board/[board]/(api)/(task)"
|
||||
import {TaskIconComponent} from "@/app/[lang]/board/[board]/(page)/(task)/TaskIconComponent"
|
||||
import {TaskSimplifiedStatus} from "@/app/[lang]/board/[board]/(page)/(task)/TaskSimplifiedStatus"
|
||||
import {TFunction} from "i18next"
|
||||
|
@ -15,7 +14,7 @@ const TASK_STATUS_TO_I18N_KEY: {[key in TaskSimplifiedStatus]: string} = {
|
|||
export type TaskViewerIconProps = {
|
||||
t: TFunction,
|
||||
status: TaskSimplifiedStatus,
|
||||
icon: TaskIcon,
|
||||
icon: string,
|
||||
onInteract?: Parameters<typeof TaskIconComponent>[0]["onInteract"]
|
||||
}
|
||||
|
||||
|
|
|
@ -2,7 +2,7 @@ import {UpdateTaskBoardChange} from "@/app/[lang]/board/[board]/(api)/(change)"
|
|||
import {useBoardConsumer} from "@/app/[lang]/board/[board]/(layout)/(contextBoard)"
|
||||
import {TaskButton} from "@/app/[lang]/board/[board]/(page)/(task)/TaskButton"
|
||||
import {TaskWithId} from "@/app/[lang]/board/[board]/(page)/(task)/TaskWithId"
|
||||
import {faBookBookmark} from "@fortawesome/free-solid-svg-icons"
|
||||
import {fas} from "@awesome.me/kit-dfe340c874/icons"
|
||||
import {TFunction} from "i18next"
|
||||
import {SyntheticEvent, useCallback} from "react"
|
||||
|
||||
|
@ -25,7 +25,7 @@ export function TaskViewerJournalButton({t, taskWithId: [id, task]}: {t: TFuncti
|
|||
return (
|
||||
<TaskButton
|
||||
title={t("taskButtonJournal")}
|
||||
icon={faBookBookmark}
|
||||
icon={fas.faBookBookmark}
|
||||
onInteract={locked ? undefined : toggleJournalTask}
|
||||
/>
|
||||
)
|
||||
|
|
|
@ -3,7 +3,7 @@ import {useBoardConsumer} from "@/app/[lang]/board/[board]/(layout)/(contextBoar
|
|||
import {taskToString} from "@/app/[lang]/board/[board]/(page)/(edit)/taskToString"
|
||||
import {TaskButton} from "@/app/[lang]/board/[board]/(page)/(task)/TaskButton"
|
||||
import {TaskWithId} from "@/app/[lang]/board/[board]/(page)/(task)/TaskWithId"
|
||||
import {faTrashArrowUp} from "@fortawesome/free-solid-svg-icons"
|
||||
import {fas} from "@awesome.me/kit-dfe340c874/icons"
|
||||
import {TFunction} from "i18next"
|
||||
import {Dispatch, SetStateAction, SyntheticEvent, useCallback} from "react"
|
||||
|
||||
|
@ -34,7 +34,7 @@ export function TaskViewerRecreateButton({t, taskWithId: [id, task], setEditorIn
|
|||
return (
|
||||
<TaskButton
|
||||
title={t("taskButtonRecreate")}
|
||||
icon={faTrashArrowUp}
|
||||
icon={fas.faTrashArrowUp}
|
||||
onInteract={locked ? undefined : recreateTask}
|
||||
/>
|
||||
)
|
||||
|
|
|
@ -4,38 +4,39 @@ import {GroupingMode} from "@/app/[lang]/board/[board]/(page)/(view)/(grouping)"
|
|||
import {SortingMode} from "@/app/[lang]/board/[board]/(page)/(view)/(sorting)"
|
||||
import {BoardViewer} from "@/app/[lang]/board/[board]/(page)/(view)/BoardViewer"
|
||||
import {SplashWithIcon} from "@/app/[lang]/board/[board]/(page)/(view)/SplashWithIcon"
|
||||
import {faAsterisk, faGear, faLink, faLinkSlash} from "@fortawesome/free-solid-svg-icons"
|
||||
import {fas} from "@awesome.me/kit-dfe340c874/icons"
|
||||
import {FontAwesomeIcon} from "@fortawesome/react-fontawesome"
|
||||
import {TFunction} from "i18next"
|
||||
import {Dispatch, SetStateAction} from "react"
|
||||
|
||||
|
||||
export function BoardMain({t, className, columning, sorting, grouping, setEditorInput}: {t: TFunction, className?: string, columning: ColumningMode, grouping: GroupingMode, sorting: SortingMode[], setEditorInput: Dispatch<SetStateAction<string>>}) {
|
||||
export function BoardMain({lang, t, className, columning, sorting, grouping, setEditorInput}: {lang: string, t: TFunction, className?: string, columning: ColumningMode, grouping: GroupingMode, sorting: SortingMode[], setEditorInput: Dispatch<SetStateAction<string>>}) {
|
||||
const {webSocketState, webSocketBackoffMs, boardState} = useBoardConsumer()
|
||||
|
||||
switch(webSocketState) {
|
||||
case undefined:
|
||||
return <SplashWithIcon
|
||||
icon={<FontAwesomeIcon size={"4x"} icon={faGear} beatFade/>}
|
||||
icon={<FontAwesomeIcon size={"4x"} icon={fas.faGear} beatFade/>}
|
||||
text={t("boardPreparing")}
|
||||
className={className}
|
||||
/>
|
||||
case WebSocket.CONNECTING:
|
||||
return <SplashWithIcon
|
||||
icon={<FontAwesomeIcon size={"4x"} icon={faLink} beatFade/>}
|
||||
icon={<FontAwesomeIcon size={"4x"} icon={fas.faLink} beatFade/>}
|
||||
text={t("boardConnecting")}
|
||||
className={className}
|
||||
/>
|
||||
case WebSocket.OPEN:
|
||||
if(Object.keys(boardState.tasks).length === 0) {
|
||||
return <SplashWithIcon
|
||||
icon={<FontAwesomeIcon size={"4x"} icon={faAsterisk}/>}
|
||||
icon={<FontAwesomeIcon size={"4x"} icon={fas.faAsterisk}/>}
|
||||
text={t("boardEmpty")}
|
||||
className={className}
|
||||
/>
|
||||
}
|
||||
else {
|
||||
return <BoardViewer
|
||||
lang={lang}
|
||||
t={t}
|
||||
columning={columning}
|
||||
sorting={sorting}
|
||||
|
@ -46,13 +47,13 @@ export function BoardMain({t, className, columning, sorting, grouping, setEditor
|
|||
}
|
||||
case WebSocket.CLOSING:
|
||||
return <SplashWithIcon
|
||||
icon={<FontAwesomeIcon size={"4x"} icon={faLinkSlash} beatFade/>}
|
||||
icon={<FontAwesomeIcon size={"4x"} icon={fas.faLinkSlash} beatFade/>}
|
||||
text={t("boardDisconnecting")}
|
||||
className={className}
|
||||
/>
|
||||
case WebSocket.CLOSED:
|
||||
return <SplashWithIcon
|
||||
icon={<FontAwesomeIcon size={"4x"} icon={faLinkSlash}/>}
|
||||
icon={<FontAwesomeIcon size={"4x"} icon={fas.faLinkSlash}/>}
|
||||
text={t("boardDisconnected", { retryingInSeconds: Math.ceil((webSocketBackoffMs ?? 0) / 1000).toString() })}
|
||||
className={className}
|
||||
/>
|
||||
|
|
|
@ -12,7 +12,7 @@ import {Dispatch, SetStateAction} from "react"
|
|||
import style from "./BoardViewer.module.css"
|
||||
|
||||
|
||||
export function BoardViewer({className, t, columning, grouping, sorting, setEditorInput}: {className?: string, t: TFunction, columning: ColumningMode, grouping: GroupingMode, sorting: SortingMode[], setEditorInput: Dispatch<SetStateAction<string>>}) {
|
||||
export function BoardViewer({className, lang, t, columning, grouping, sorting, setEditorInput}: {className?: string, t: TFunction, lang: string, columning: ColumningMode, grouping: GroupingMode, sorting: SortingMode[], setEditorInput: Dispatch<SetStateAction<string>>}) {
|
||||
const {boardState: {tasks}} = useBoardConsumer()
|
||||
const {taskGroups} = useBoardTasksArranger(tasks, grouping, sorting);
|
||||
|
||||
|
@ -22,12 +22,12 @@ export function BoardViewer({className, t, columning, grouping, sorting, setEdit
|
|||
[style.boardMainTaskGroupsMultiColumn]: columning === ColumningMode.MultiColumn,
|
||||
[style.boardMainTaskGroupsSingleColumn]: columning === ColumningMode.SingleColumn,
|
||||
})}>
|
||||
{taskGroups.map((tg) => <BoardViewerColumn t={t} taskGroup={tg} key={tg.k} grouping={grouping} setEditorInput={setEditorInput}/>)}
|
||||
{taskGroups.map((tg) => <BoardViewerColumn lang={lang} t={t} taskGroup={tg} key={tg.k} grouping={grouping} setEditorInput={setEditorInput}/>)}
|
||||
</main>
|
||||
)
|
||||
}
|
||||
|
||||
export function BoardViewerColumn({t, grouping, taskGroup, setEditorInput}: {t: TFunction, grouping: GroupingMode, taskGroup: TaskGroup<string | number>, setEditorInput: Dispatch<SetStateAction<string>>}) {
|
||||
export function BoardViewerColumn({lang, t, grouping, taskGroup, setEditorInput}: {lang: string, t: TFunction, grouping: GroupingMode, taskGroup: TaskGroup<string | number>, setEditorInput: Dispatch<SetStateAction<string>>}) {
|
||||
const ColumnTitle = GROUPING_MODE_TO_TITLE_COMPONENT[grouping]
|
||||
|
||||
return (
|
||||
|
@ -36,7 +36,7 @@ export function BoardViewerColumn({t, grouping, taskGroup, setEditorInput}: {t:
|
|||
<ColumnTitle t={t} k={taskGroup.k}/>
|
||||
</h3>
|
||||
<div className={style.boardColumnContents}>
|
||||
{taskGroup.tasks.map((task: TaskWithId) => <TaskViewer t={t} taskWithId={task} key={task[0]} setEditorInput={setEditorInput}/>)}
|
||||
{taskGroup.tasks.map((task: TaskWithId) => <TaskViewer lang={lang} t={t} taskWithId={task} key={task[0]} setEditorInput={setEditorInput}/>)}
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
|
|
|
@ -15,7 +15,7 @@ export function BoardPage({lang}: {lang: string}) {
|
|||
const internationalization = useClientTranslation(lang, "board")
|
||||
const metadataHook = useBoardMetadataEditor()
|
||||
const layoutHook = useBoardLayoutEditor()
|
||||
const editorHook = useTaskEditor()
|
||||
const editorHook = useTaskEditor(lang)
|
||||
|
||||
const t = internationalization.t as TFunction
|
||||
|
||||
|
@ -28,6 +28,7 @@ export function BoardPage({lang}: {lang: string}) {
|
|||
layoutHook={layoutHook}
|
||||
/>
|
||||
<BoardMain
|
||||
lang={lang}
|
||||
t={t}
|
||||
className={style.pageMain}
|
||||
columning={layoutHook.columningHook.value}
|
||||
|
|
|
@ -19,7 +19,6 @@ export function useBoardLayoutEditor() {
|
|||
ColumningMode.MultiColumn,
|
||||
])
|
||||
const groupingHook = useCycler(useLocalStorage<number | undefined>(localStorageKeyGrouping, undefined), [
|
||||
GroupingMode.ByPriority,
|
||||
GroupingMode.ByImportance,
|
||||
GroupingMode.ByStatus,
|
||||
GroupingMode.ByIcon,
|
||||
|
@ -28,7 +27,7 @@ export function useBoardLayoutEditor() {
|
|||
const sortingHook = useCycler(useLocalStorage<number | undefined>(localStorageKeySorting, undefined), [
|
||||
[
|
||||
SortingMode.ByStatus,
|
||||
SortingMode.ByPriority,
|
||||
SortingMode.ByDeadline,
|
||||
SortingMode.ByImportance,
|
||||
SortingMode.ByText,
|
||||
SortingMode.ByIcon,
|
||||
|
@ -37,7 +36,7 @@ export function useBoardLayoutEditor() {
|
|||
[
|
||||
SortingMode.ByStatus,
|
||||
SortingMode.ByImportance,
|
||||
SortingMode.ByPriority,
|
||||
SortingMode.ByDeadline,
|
||||
SortingMode.ByText,
|
||||
SortingMode.ByIcon,
|
||||
SortingMode.ByCreation,
|
||||
|
@ -53,7 +52,7 @@ export function useBoardLayoutEditor() {
|
|||
SortingMode.ByCreation,
|
||||
],
|
||||
[
|
||||
SortingMode.ByPriority,
|
||||
SortingMode.ByDeadline,
|
||||
SortingMode.ByImportance,
|
||||
SortingMode.ByText,
|
||||
SortingMode.ByIcon,
|
||||
|
@ -61,7 +60,7 @@ export function useBoardLayoutEditor() {
|
|||
],
|
||||
[
|
||||
SortingMode.ByImportance,
|
||||
SortingMode.ByPriority,
|
||||
SortingMode.ByDeadline,
|
||||
SortingMode.ByText,
|
||||
SortingMode.ByIcon,
|
||||
SortingMode.ByCreation,
|
||||
|
|
|
@ -4,12 +4,12 @@ import {taskToString} from "@/app/[lang]/board/[board]/(page)/(edit)/taskToStrin
|
|||
import {useCallback, useMemo, useState} from "react"
|
||||
|
||||
|
||||
export function useTaskEditor() {
|
||||
export function useTaskEditor(lang: string) {
|
||||
const [input, setInput] = useState<string>("")
|
||||
const task = useMemo(() => stringToTask(input), [input])
|
||||
const task = useMemo(() => stringToTask(input, lang), [input, lang])
|
||||
|
||||
const setTask = useCallback((t: Task) => {
|
||||
setInput(taskToString(t))
|
||||
setInput(taskToString(t, lang))
|
||||
}, [])
|
||||
|
||||
return {
|
||||
|
|
|
@ -2,6 +2,13 @@
|
|||
# yarn lockfile v1
|
||||
|
||||
|
||||
"@awesome.me/kit-dfe340c874@^1.0.10":
|
||||
version "1.0.10"
|
||||
resolved "https://npm.fontawesome.com/@awesome.me/kit-dfe340c874/-/1.0.10/kit-dfe340c874-1.0.10.tgz#a09e8b5a92ab9d58e703008f5adde7aaeaf6f629"
|
||||
integrity sha512-q8cIvNP/0xULSNs5XqusIa4pTgI9pvMubNZIQQWIDM8yacpYt1wM54jOceq0g3tGTzl1HummO4oN5Xdfbm8gww==
|
||||
dependencies:
|
||||
"@fortawesome/fontawesome-common-types" "^6.6.0"
|
||||
|
||||
"@babel/runtime@^7.23.2":
|
||||
version "7.25.6"
|
||||
resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.25.6.tgz#9afc3289f7184d8d7f98b099884c26317b9264d2"
|
||||
|
@ -9,35 +16,21 @@
|
|||
dependencies:
|
||||
regenerator-runtime "^0.14.0"
|
||||
|
||||
"@fortawesome/fontawesome-common-types@6.6.0":
|
||||
"@fortawesome/fontawesome-common-types@6.6.0", "@fortawesome/fontawesome-common-types@^6.6.0":
|
||||
version "6.6.0"
|
||||
resolved "https://registry.yarnpkg.com/@fortawesome/fontawesome-common-types/-/fontawesome-common-types-6.6.0.tgz#31ab07ca6a06358c5de4d295d4711b675006163f"
|
||||
resolved "https://npm.fontawesome.com/@fortawesome/fontawesome-common-types/-/6.6.0/fontawesome-common-types-6.6.0.tgz#31ab07ca6a06358c5de4d295d4711b675006163f"
|
||||
integrity sha512-xyX0X9mc0kyz9plIyryrRbl7ngsA9jz77mCZJsUkLl+ZKs0KWObgaEBoSgQiYWAsSmjz/yjl0F++Got0Mdp4Rw==
|
||||
|
||||
"@fortawesome/fontawesome-svg-core@*":
|
||||
version "6.6.0"
|
||||
resolved "https://registry.yarnpkg.com/@fortawesome/fontawesome-svg-core/-/fontawesome-svg-core-6.6.0.tgz#2a24c32ef92136e98eae2ff334a27145188295ff"
|
||||
resolved "https://npm.fontawesome.com/@fortawesome/fontawesome-svg-core/-/6.6.0/fontawesome-svg-core-6.6.0.tgz#2a24c32ef92136e98eae2ff334a27145188295ff"
|
||||
integrity sha512-KHwPkCk6oRT4HADE7smhfsKudt9N/9lm6EJ5BVg0tD1yPA5hht837fB87F8pn15D8JfTqQOjhKTktwmLMiD7Kg==
|
||||
dependencies:
|
||||
"@fortawesome/fontawesome-common-types" "6.6.0"
|
||||
|
||||
"@fortawesome/free-regular-svg-icons@*":
|
||||
version "6.6.0"
|
||||
resolved "https://registry.yarnpkg.com/@fortawesome/free-regular-svg-icons/-/free-regular-svg-icons-6.6.0.tgz#fc49a947ac8dfd20403c9ea5f37f0919425bdf04"
|
||||
integrity sha512-Yv9hDzL4aI73BEwSEh20clrY8q/uLxawaQ98lekBx6t9dQKDHcDzzV1p2YtBGTtolYtNqcWdniOnhzB+JPnQEQ==
|
||||
dependencies:
|
||||
"@fortawesome/fontawesome-common-types" "6.6.0"
|
||||
|
||||
"@fortawesome/free-solid-svg-icons@*":
|
||||
version "6.6.0"
|
||||
resolved "https://registry.yarnpkg.com/@fortawesome/free-solid-svg-icons/-/free-solid-svg-icons-6.6.0.tgz#061751ca43be4c4d814f0adbda8f006164ec9f3b"
|
||||
integrity sha512-IYv/2skhEDFc2WGUcqvFJkeK39Q+HyPf5GHUrT/l2pKbtgEIv1al1TKd6qStR5OIwQdN1GZP54ci3y4mroJWjA==
|
||||
dependencies:
|
||||
"@fortawesome/fontawesome-common-types" "6.6.0"
|
||||
|
||||
"@fortawesome/react-fontawesome@*":
|
||||
version "0.2.2"
|
||||
resolved "https://registry.yarnpkg.com/@fortawesome/react-fontawesome/-/react-fontawesome-0.2.2.tgz#68b058f9132b46c8599875f6a636dad231af78d4"
|
||||
resolved "https://npm.fontawesome.com/@fortawesome/react-fontawesome/-/0.2.2/react-fontawesome-0.2.2.tgz#68b058f9132b46c8599875f6a636dad231af78d4"
|
||||
integrity sha512-EnkrprPNqI6SXJl//m29hpaNzOp1bruISWaOiRtkMi/xSvHJlzc2j2JAYS7egxt/EbjSNV/k6Xy0AQI6vB2+1g==
|
||||
dependencies:
|
||||
prop-types "^15.8.1"
|
||||
|
@ -142,6 +135,11 @@
|
|||
"@types/prop-types" "*"
|
||||
csstype "^3.0.2"
|
||||
|
||||
any-date-parser@^1.5.4:
|
||||
version "1.5.4"
|
||||
resolved "https://registry.yarnpkg.com/any-date-parser/-/any-date-parser-1.5.4.tgz#3c462f3a419b7147a88a8c7cab91da4193ff680b"
|
||||
integrity sha512-S4gl9UmXNk9XXSQxp5w5harUD6aM0fepyL3dZM/B3znX57sWf792hS2UvvCFIHECfpsqfKbQ+cqWBky4AKyRIg==
|
||||
|
||||
busboy@1.6.0:
|
||||
version "1.6.0"
|
||||
resolved "https://registry.yarnpkg.com/busboy/-/busboy-1.6.0.tgz#966ea36a9502e43cdb9146962523b92f531f6893"
|
||||
|
|
Loading…
Reference in a new issue