diff --git a/todoblue/src/app/CreatePrivateBoardPanel.tsx b/todoblue/src/app/CreatePrivateBoardPanel.tsx index bf05568..dbdd63b 100644 --- a/todoblue/src/app/CreatePrivateBoardPanel.tsx +++ b/todoblue/src/app/CreatePrivateBoardPanel.tsx @@ -4,12 +4,26 @@ import {useBoardCreator} from "@/app/useBoardCreator" import {faKey} from "@fortawesome/free-solid-svg-icons" import {FontAwesomeIcon} from "@fortawesome/react-fontawesome" import classNames from "classnames" -import {default as React} from "react" +import {default as React, useEffect, useState} from "react" export function CreatePrivateBoardPanel() { const {createBoard} = useBoardCreator(); + const [canCreate, setCanCreate] = useState(null); - const isSecure = typeof window !== "undefined" && window.isSecureContext; + useEffect(() => { + setCanCreate(window.isSecureContext) + }, []) + + let formContents; + if(canCreate === null) { + formContents = + } + else if(!canCreate) { + formContents = + } + else { + formContents = + } return (
{ e.preventDefault(); @@ -29,28 +44,44 @@ export function CreatePrivateBoardPanel() { {" "} Privato - {isSecure ? - <> -

- Crea un nuovo tabellone privato utilizzando un codice segreto autogenerato! -
- Esso sarà accessibile solo da chi ne conosce il link. -

- - : <> -

- Questa funzionalità non è disponibile al di fuori di contesti sicuri. -
- Assicurati di stare usando HTTPS! -

- - } + {formContents}
) } + +function MightCreateBoardFormContents() { + return <> +

+ Sto verificando se è possibile creare un tabellone privato sul tuo browser... +
+ Attendi un attimo... +

+ +} + +function CanCreateBoardFormContents() { + return <> +

+ Crea un nuovo tabellone privato utilizzando un codice segreto autogenerato! +
+ Esso sarà accessibile solo da chi ne conosce il link. +

+ + +} + +function CannotCreateBoardFormContents() { + return <> +

+ Questa funzionalità non è disponibile al di fuori di contesti sicuri. +
+ Assicurati di stare usando HTTPS! +

+ +} diff --git a/todoblue/src/app/board/[board]/useBoard.tsx b/todoblue/src/app/board/[board]/useBoard.tsx index daf3823..f582fdf 100644 --- a/todoblue/src/app/board/[board]/useBoard.tsx +++ b/todoblue/src/app/board/[board]/useBoard.tsx @@ -2,7 +2,7 @@ import {TASK_GROUPERS} from "@/app/board/[board]/doTaskGrouping" import {TASK_SORTERS} from "@/app/board/[board]/doTaskSorting" -import {BoardAction} from "@/app/board/[board]/Types" +import {BoardAction, Task} from "@/app/board/[board]/Types" import {useBoardWebSocket} from "@/app/board/[board]/useBoardWebSocket" import {TaskGroup, useBoardTaskArranger} from "@/app/board/[board]/useBoardTaskArranger" import {useBoardTitleEditor} from "@/app/board/[board]/useBoardTitleEditor" @@ -11,6 +11,7 @@ import {Dispatch, SetStateAction} from "react" export interface UseBoardReturns { title: string, + tasksById: {[id: string]: Task}, taskGroups: TaskGroup[], websocketState: number, isEditingTitle: boolean, @@ -39,6 +40,7 @@ export function useBoard(name: string): UseBoardReturns { return { title, + tasksById, taskGroups, websocketState, isEditingTitle,