add warning text in DataTransferModal when disconnected

This commit is contained in:
marlon-erler
2024-07-28 19:37:04 +02:00
parent 4c51ff7195
commit af176017f0
4 changed files with 69 additions and 33 deletions
+36 -21
View File
@@ -2511,6 +2511,7 @@
dataEntryDescription: "Enter this data on the other device.",
dataEntryInputDescription: "Enter the data displayed on the other device.",
readyToReceiveDescription: "Click 'send' on the other device.",
notConnectedError: "You are not connected to any server.",
///
fromThisDeviceButton: "From this device",
toThisDeviceButton: "To this device",
@@ -2695,6 +2696,7 @@
dataEntryDescription: "Gib diese Informationen auf dem anderen Ger\xE4t ein.",
dataEntryInputDescription: "Gib die auf dem anderen Ger\xE4t angezeigten Informationen ein.",
readyToReceiveDescription: "Klicke auf dem anderen Ger\xE4t auf 'Senden'.",
notConnectedError: "Du bist mit keinem Server verbunden.",
fromThisDeviceButton: "Von diesem Ger\xE4t",
toThisDeviceButton: "An dieses Ger\xE4t",
generalHeadline: "Allgemein",
@@ -2863,6 +2865,7 @@
dataEntryDescription: "Introduce estos datos en el otro dispositivo.",
dataEntryInputDescription: "Introduce los datos mostrados en el otro dispositivo.",
readyToReceiveDescription: "Haz clic en 'enviar' en el otro dispositivo.",
notConnectedError: "No est\xE1s conectado a ning\xFAn servidor.",
fromThisDeviceButton: "Desde este dispositivo",
toThisDeviceButton: "A este dispositivo",
generalHeadline: "General",
@@ -4985,33 +4988,45 @@
};
// src/View/Modals/dataTransferModal.tsx
function DataTransferModalWrapper(fileTransferViewModel2) {
return /* @__PURE__ */ createElement("div", null, DirectionSelectionModal(fileTransferViewModel2), FileSelectionModal(fileTransferViewModel2), TransferDataDisplayModal(fileTransferViewModel2), TransferDisplayModal(fileTransferViewModel2), TransferDataInputModal(fileTransferViewModel2), DataReceptionModal(fileTransferViewModel2));
function DataTransferModalWrapper(connectionViewModel2, fileTransferViewModel2) {
return /* @__PURE__ */ createElement("div", null, DirectionSelectionModal(connectionViewModel2, fileTransferViewModel2), FileSelectionModal(fileTransferViewModel2), TransferDataDisplayModal(fileTransferViewModel2), TransferDisplayModal(fileTransferViewModel2), TransferDataInputModal(fileTransferViewModel2), DataReceptionModal(fileTransferViewModel2));
}
function DirectionSelectionModal(fileTransferViewModel2) {
function DirectionSelectionModal(connectionViewModel2, fileTransferViewModel2) {
const isPresented = createProxyState(
[fileTransferViewModel2.presentedModal],
() => fileTransferViewModel2.presentedModal.value == 0 /* DirectionSelection */
);
return /* @__PURE__ */ createElement("div", { class: "modal", "toggle:open": isPresented }, /* @__PURE__ */ createElement("div", null, /* @__PURE__ */ createElement("main", null, /* @__PURE__ */ createElement("h2", null, translations.dataTransferModal.transferDataHeadline), /* @__PURE__ */ createElement("div", { class: "flex-column gap content-margin-bottom" }, /* @__PURE__ */ createElement(
"button",
const isDisconnected = createProxyState(
[connectionViewModel2.isConnected],
() => connectionViewModel2.isConnected.value == false
);
return /* @__PURE__ */ createElement("div", { class: "modal", "toggle:open": isPresented }, /* @__PURE__ */ createElement("div", null, /* @__PURE__ */ createElement("main", null, /* @__PURE__ */ createElement("h2", null, translations.dataTransferModal.transferDataHeadline), /* @__PURE__ */ createElement("p", { class: "error", "toggle:hidden": connectionViewModel2.isConnected }, translations.dataTransferModal.notConnectedError), /* @__PURE__ */ createElement(
"div",
{
class: "tile",
"on:click": fileTransferViewModel2.showFileSelectionModal
class: "flex-column gap content-margin-bottom",
"toggle:hidden": isDisconnected
},
/* @__PURE__ */ createElement("span", { class: "icon" }, "upload"),
/* @__PURE__ */ createElement("div", null, /* @__PURE__ */ createElement("b", null, translations.dataTransferModal.fromThisDeviceButton)),
/* @__PURE__ */ createElement("span", { class: "icon" }, "arrow_forward")
), /* @__PURE__ */ createElement(
"button",
{
class: "tile",
"on:click": fileTransferViewModel2.showTransferDataInputModal
},
/* @__PURE__ */ createElement("span", { class: "icon" }, "download"),
/* @__PURE__ */ createElement("div", null, /* @__PURE__ */ createElement("b", null, translations.dataTransferModal.toThisDeviceButton)),
/* @__PURE__ */ createElement("span", { class: "icon" }, "arrow_forward")
))), /* @__PURE__ */ createElement("button", { "on:click": fileTransferViewModel2.hideModal }, translations.general.closeButton, /* @__PURE__ */ createElement("span", { class: "icon" }, "close"))));
/* @__PURE__ */ createElement(
"button",
{
class: "tile",
"on:click": fileTransferViewModel2.showFileSelectionModal
},
/* @__PURE__ */ createElement("span", { class: "icon" }, "upload"),
/* @__PURE__ */ createElement("div", null, /* @__PURE__ */ createElement("b", null, translations.dataTransferModal.fromThisDeviceButton)),
/* @__PURE__ */ createElement("span", { class: "icon" }, "arrow_forward")
),
/* @__PURE__ */ createElement(
"button",
{
class: "tile",
"on:click": fileTransferViewModel2.showTransferDataInputModal
},
/* @__PURE__ */ createElement("span", { class: "icon" }, "download"),
/* @__PURE__ */ createElement("div", null, /* @__PURE__ */ createElement("b", null, translations.dataTransferModal.toThisDeviceButton)),
/* @__PURE__ */ createElement("span", { class: "icon" }, "arrow_forward")
)
)), /* @__PURE__ */ createElement("button", { "on:click": fileTransferViewModel2.hideModal }, translations.general.closeButton, /* @__PURE__ */ createElement("span", { class: "icon" }, "close"))));
}
function FileSelectionModal(fileTransferViewModel2) {
const OptionConverter = (fileOption) => {
@@ -5910,7 +5925,7 @@
),
ChatPageWrapper(chatListViewModel),
ConnectionModal(connectionViewModel),
DataTransferModalWrapper(fileTransferViewModel),
DataTransferModalWrapper(connectionViewModel, fileTransferViewModel),
StorageModal(storageViewModel)
);
})();
+20 -3
View File
@@ -5,17 +5,19 @@ import FileTransferViewModel, {
FileTransferOption,
} from "../../ViewModel/Global/fileTransferViewModel";
import ConnectionViewModel from "../../ViewModel/Global/connectionViewModel";
import StorageModel from "../../Model/Global/storageModel";
import { StringToTextSpan } from "../Components/textSpan";
import { reload } from "../utility";
import { translations } from "../translations";
export function DataTransferModalWrapper(
connectionViewModel: ConnectionViewModel,
fileTransferViewModel: FileTransferViewModel
) {
return (
<div>
{DirectionSelectionModal(fileTransferViewModel)}
{DirectionSelectionModal(connectionViewModel, fileTransferViewModel)}
{FileSelectionModal(fileTransferViewModel)}
{TransferDataDisplayModal(fileTransferViewModel)}
{TransferDisplayModal(fileTransferViewModel)}
@@ -25,7 +27,10 @@ export function DataTransferModalWrapper(
);
}
function DirectionSelectionModal(fileTransferViewModel: FileTransferViewModel) {
function DirectionSelectionModal(
connectionViewModel: ConnectionViewModel,
fileTransferViewModel: FileTransferViewModel
) {
const isPresented = React.createProxyState(
[fileTransferViewModel.presentedModal],
() =>
@@ -33,13 +38,25 @@ function DirectionSelectionModal(fileTransferViewModel: FileTransferViewModel) {
FileTransferModal.DirectionSelection
);
const isDisconnected = React.createProxyState(
[connectionViewModel.isConnected],
() => connectionViewModel.isConnected.value == false
);
return (
<div class="modal" toggle:open={isPresented}>
<div>
<main>
<h2>{translations.dataTransferModal.transferDataHeadline}</h2>
<div class="flex-column gap content-margin-bottom">
<p class="error" toggle:hidden={connectionViewModel.isConnected}>
{translations.dataTransferModal.notConnectedError}
</p>
<div
class="flex-column gap content-margin-bottom"
toggle:hidden={isDisconnected}
>
<button
class="tile"
on:click={fileTransferViewModel.showFileSelectionModal}
+12 -8
View File
@@ -88,6 +88,8 @@ const englishTranslations = {
dataEntryInputDescription: "Enter the data displayed on the other device.",
readyToReceiveDescription: "Click 'send' on the other device.",
notConnectedError: "You are not connected to any server.",
///
fromThisDeviceButton: "From this device",
@@ -128,7 +130,7 @@ const englishTranslations = {
deleteItem: "Delete item",
removeJunkButton: "Delete junk files"
removeJunkButton: "Delete junk files",
},
chatPage: {
@@ -242,7 +244,7 @@ const englishTranslations = {
eventsBoard: "Events",
///
todayButtonAudioLabel: "go to today",
previousMonthButtonAudioLabel: "previous month",
@@ -348,14 +350,14 @@ const allTranslations: { [language: string]: typeof englishTranslations } = {
dataTransferModal: {
transferDataHeadline: "Datenübertragung",
selectionDescription:
"Wähle die Daten aus, die du übertragen möchtest.",
selectionDescription: "Wähle die Daten aus, die du übertragen möchtest.",
dataEntryDescription:
"Gib diese Informationen auf dem anderen Gerät ein.",
dataEntryInputDescription:
"Gib die auf dem anderen Gerät angezeigten Informationen ein.",
readyToReceiveDescription:
"Klicke auf dem anderen Gerät auf 'Senden'.",
readyToReceiveDescription: "Klicke auf dem anderen Gerät auf 'Senden'.",
notConnectedError: "Du bist mit keinem Server verbunden.",
fromThisDeviceButton: "Von diesem Gerät",
toThisDeviceButton: "An dieses Gerät",
@@ -389,7 +391,7 @@ const allTranslations: { [language: string]: typeof englishTranslations } = {
deleteItem: "Element löschen",
removeJunkButton: "Datenmüll löschen"
removeJunkButton: "Datenmüll löschen",
},
chatPage: {
@@ -591,6 +593,8 @@ const allTranslations: { [language: string]: typeof englishTranslations } = {
"Introduce los datos mostrados en el otro dispositivo.",
readyToReceiveDescription: "Haz clic en 'enviar' en el otro dispositivo.",
notConnectedError: "No estás conectado a ningún servidor.",
fromThisDeviceButton: "Desde este dispositivo",
toThisDeviceButton: "A este dispositivo",
@@ -623,7 +627,7 @@ const allTranslations: { [language: string]: typeof englishTranslations } = {
deleteItem: "Eliminar elemento",
removeJunkButton: "Eliminar archivos basura"
removeJunkButton: "Eliminar archivos basura",
},
chatPage: {
+1 -1
View File
@@ -83,6 +83,6 @@ document
),
ChatPageWrapper(chatListViewModel),
ConnectionModal(connectionViewModel),
DataTransferModalWrapper(fileTransferViewModel),
DataTransferModalWrapper(connectionViewModel, fileTransferViewModel),
StorageModal(storageViewModel)
);