move message to typescript

This commit is contained in:
grimhilt 2023-04-07 15:15:49 +02:00
parent 7e0e27c2b6
commit 649bccb01e
6 changed files with 182 additions and 26 deletions

114
front/package-lock.json generated
View File

@ -16,6 +16,7 @@
"@babel/core": "^7.12.16",
"@babel/eslint-parser": "^7.12.16",
"@babel/preset-typescript": "^7.21.4",
"@types/dompurify": "^3.0.1",
"@types/jest": "^27.0.1",
"@typescript-eslint/eslint-plugin": "^5.4.0",
"@typescript-eslint/parser": "^5.4.0",
@ -2816,6 +2817,17 @@
"@types/node": "*"
}
},
"node_modules/@types/dompurify": {
"version": "3.0.1",
"resolved": "https://repo.plus4u.net/operatorGate/repository/public-javascript/@types/dompurify/-/dompurify-3.0.1.tgz",
"integrity": "sha512-ubq8VKmf8W+U48jUOiZO4BoSGS7NnbITPMvrF+7HgMN4L+eezCKv8QBPB8p3o4YPicLMmNeTyDkE5X4c2ViHJQ==",
"dev": true,
"license": "MIT",
"dependencies": {
"@types/jsdom": "*",
"@types/trusted-types": "*"
}
},
"node_modules/@types/eslint": {
"version": "8.21.0",
"resolved": "https://registry.npmmirror.com/@types/eslint/-/eslint-8.21.0.tgz",
@ -2935,6 +2947,44 @@
"pretty-format": "^27.0.0"
}
},
"node_modules/@types/jsdom": {
"version": "21.1.1",
"resolved": "https://repo.plus4u.net/operatorGate/repository/public-javascript/@types/jsdom/-/jsdom-21.1.1.tgz",
"integrity": "sha512-cZFuoVLtzKP3gmq9eNosUL1R50U+USkbLtUQ1bYVgl/lKp0FZM7Cq4aIHAL8oIvQ17uSHi7jXPtfDOdjPwBE7A==",
"dev": true,
"license": "MIT",
"dependencies": {
"@types/node": "*",
"@types/tough-cookie": "*",
"parse5": "^7.0.0"
}
},
"node_modules/@types/jsdom/node_modules/entities": {
"version": "4.4.0",
"resolved": "https://repo.plus4u.net/operatorGate/repository/public-javascript/entities/-/entities-4.4.0.tgz",
"integrity": "sha512-oYp7156SP8LkeGD0GF85ad1X9Ai79WtRsZ2gxJqtBuzH+98YUV6jkHEKlZkMbcrjJjIVJNIDP/3WL9wQkoPbWA==",
"dev": true,
"license": "BSD-2-Clause",
"engines": {
"node": ">=0.12"
},
"funding": {
"url": "https://github.com/fb55/entities?sponsor=1"
}
},
"node_modules/@types/jsdom/node_modules/parse5": {
"version": "7.1.2",
"resolved": "https://repo.plus4u.net/operatorGate/repository/public-javascript/parse5/-/parse5-7.1.2.tgz",
"integrity": "sha512-Czj1WaSVpaoj0wbhMzLmWD69anp2WH7FXMB9n1Sy8/ZFF9jolSQVMu1Ij5WIyGmcBmhk7EOndpO4mIpihVqAXw==",
"dev": true,
"license": "MIT",
"dependencies": {
"entities": "^4.4.0"
},
"funding": {
"url": "https://github.com/inikulin/parse5?sponsor=1"
}
},
"node_modules/@types/json-schema": {
"version": "7.0.11",
"resolved": "https://registry.npmmirror.com/@types/json-schema/-/json-schema-7.0.11.tgz",
@ -3064,6 +3114,20 @@
"dev": true,
"license": "MIT"
},
"node_modules/@types/tough-cookie": {
"version": "4.0.2",
"resolved": "https://repo.plus4u.net/operatorGate/repository/public-javascript/@types/tough-cookie/-/tough-cookie-4.0.2.tgz",
"integrity": "sha512-Q5vtl1W5ue16D+nIaW8JWebSSraJVlK+EthKn7e7UcD4KWsaSJ8BqGPXNaPghgtcn/fhvrN17Tv8ksUsQpiplw==",
"dev": true,
"license": "MIT"
},
"node_modules/@types/trusted-types": {
"version": "2.0.3",
"resolved": "https://repo.plus4u.net/operatorGate/repository/public-javascript/@types/trusted-types/-/trusted-types-2.0.3.tgz",
"integrity": "sha512-NfQ4gyz38SL8sDNrSixxU2Os1a5xcdFxipAFxYEuLUlvU2uDwS4NUpsImcf1//SlWItCVMMLiylsxbmNMToV/g==",
"dev": true,
"license": "MIT"
},
"node_modules/@types/web-bluetooth": {
"version": "0.0.16",
"resolved": "https://repo.plus4u.net/operatorGate/repository/public-javascript/@types/web-bluetooth/-/web-bluetooth-0.0.16.tgz",
@ -17897,6 +17961,16 @@
"@types/node": "*"
}
},
"@types/dompurify": {
"version": "3.0.1",
"resolved": "https://repo.plus4u.net/operatorGate/repository/public-javascript/@types/dompurify/-/dompurify-3.0.1.tgz",
"integrity": "sha512-ubq8VKmf8W+U48jUOiZO4BoSGS7NnbITPMvrF+7HgMN4L+eezCKv8QBPB8p3o4YPicLMmNeTyDkE5X4c2ViHJQ==",
"dev": true,
"requires": {
"@types/jsdom": "*",
"@types/trusted-types": "*"
}
},
"@types/eslint": {
"version": "8.21.0",
"resolved": "https://registry.npmmirror.com/@types/eslint/-/eslint-8.21.0.tgz",
@ -18004,6 +18078,34 @@
"pretty-format": "^27.0.0"
}
},
"@types/jsdom": {
"version": "21.1.1",
"resolved": "https://repo.plus4u.net/operatorGate/repository/public-javascript/@types/jsdom/-/jsdom-21.1.1.tgz",
"integrity": "sha512-cZFuoVLtzKP3gmq9eNosUL1R50U+USkbLtUQ1bYVgl/lKp0FZM7Cq4aIHAL8oIvQ17uSHi7jXPtfDOdjPwBE7A==",
"dev": true,
"requires": {
"@types/node": "*",
"@types/tough-cookie": "*",
"parse5": "^7.0.0"
},
"dependencies": {
"entities": {
"version": "4.4.0",
"resolved": "https://repo.plus4u.net/operatorGate/repository/public-javascript/entities/-/entities-4.4.0.tgz",
"integrity": "sha512-oYp7156SP8LkeGD0GF85ad1X9Ai79WtRsZ2gxJqtBuzH+98YUV6jkHEKlZkMbcrjJjIVJNIDP/3WL9wQkoPbWA==",
"dev": true
},
"parse5": {
"version": "7.1.2",
"resolved": "https://repo.plus4u.net/operatorGate/repository/public-javascript/parse5/-/parse5-7.1.2.tgz",
"integrity": "sha512-Czj1WaSVpaoj0wbhMzLmWD69anp2WH7FXMB9n1Sy8/ZFF9jolSQVMu1Ij5WIyGmcBmhk7EOndpO4mIpihVqAXw==",
"dev": true,
"requires": {
"entities": "^4.4.0"
}
}
}
},
"@types/json-schema": {
"version": "7.0.11",
"resolved": "https://registry.npmmirror.com/@types/json-schema/-/json-schema-7.0.11.tgz",
@ -18116,6 +18218,18 @@
"integrity": "sha512-7NQmHra/JILCd1QqpSzl8+mJRc8ZHz3uDm8YV1Ks9IhK0epEiTw8aIErbvH9PI+6XbqhyIQy3462nEsn7UVzjQ==",
"dev": true
},
"@types/tough-cookie": {
"version": "4.0.2",
"resolved": "https://repo.plus4u.net/operatorGate/repository/public-javascript/@types/tough-cookie/-/tough-cookie-4.0.2.tgz",
"integrity": "sha512-Q5vtl1W5ue16D+nIaW8JWebSSraJVlK+EthKn7e7UcD4KWsaSJ8BqGPXNaPghgtcn/fhvrN17Tv8ksUsQpiplw==",
"dev": true
},
"@types/trusted-types": {
"version": "2.0.3",
"resolved": "https://repo.plus4u.net/operatorGate/repository/public-javascript/@types/trusted-types/-/trusted-types-2.0.3.tgz",
"integrity": "sha512-NfQ4gyz38SL8sDNrSixxU2Os1a5xcdFxipAFxYEuLUlvU2uDwS4NUpsImcf1//SlWItCVMMLiylsxbmNMToV/g==",
"dev": true
},
"@types/web-bluetooth": {
"version": "0.0.16",
"resolved": "https://repo.plus4u.net/operatorGate/repository/public-javascript/@types/web-bluetooth/-/web-bluetooth-0.0.16.tgz",

View File

@ -17,6 +17,7 @@
"@babel/core": "^7.12.16",
"@babel/eslint-parser": "^7.12.16",
"@babel/preset-typescript": "^7.21.4",
"@types/dompurify": "^3.0.1",
"@types/jest": "^27.0.1",
"@typescript-eslint/eslint-plugin": "^5.4.0",
"@typescript-eslint/parser": "^5.4.0",

View File

@ -8,6 +8,8 @@ export enum RoomType {
export interface Message {
fromA: string;
toA: string;
ccA?: string;
subject: string;
content: string;
date: string;

View File

@ -1,5 +1,5 @@
export function removeDuplicates(array: []) {
const unique: [] = [];
export function removeDuplicates(array: any[]) {
const unique: any[] = [];
for (let i = 0; i < array.length; i++) {
if (!unique.includes(array[i])) {
unique.push(array[i]);

View File

@ -1,23 +1,19 @@
<script setup>
import { defineProps, onMounted, ref, watch } from "vue";
<script setup lang="ts">
import { defineProps, onMounted, ref, watch, PropType, Prop } from "vue";
import { decodeEmojis } from "../../utils/string";
import { removeDuplicates } from "../../utils/array";
import DOMPurify from "dompurify";
import { Address, Message } from "@/store/models/model";
const props = defineProps({
data: {
fromA: String,
subject: String,
content: String,
date: String,
},
members: Array,
data: Object as PropType<Message>,
members: Array as PropType<Address[]>,
});
const iframe = ref(null);
const iframe = ref<HTMLIFrameElement>();
// todo dompurify
// background vs color
const htmlDefault = (html) => {
const htmlDefault = (html: string) => {
return `
<!DOCTYPE html>
<html lang="en">
@ -34,8 +30,11 @@ const htmlDefault = (html) => {
`;
};
function setIframeContent(content) {
const doc = iframe.value.contentDocument || iframe.value.contentWindow.document;
function setIframeContent(content: string | undefined) {
if (!iframe.value) return;
if (!content) return;
const doc = iframe.value.contentDocument || iframe.value.contentWindow?.document;
if (!doc) return;
const html = DOMPurify.sanitize(content);
doc.open();
doc.write(htmlDefault(html));
@ -44,20 +43,21 @@ function setIframeContent(content) {
watch(
() => props.data,
(newData) => {
setIframeContent(newData.content);
(newData: Message | undefined) => {
setIframeContent(newData?.content);
},
);
onMounted(() => {
setIframeContent(props.data.content);
setIframeContent(props.data?.content);
});
const displayAddresses = (addressesId) => {
addressesId = removeDuplicates(addressesId);
const displayAddresses = (addressIds: string[] | undefined): string => {
if (!addressIds) return "";
addressIds = removeDuplicates(addressIds);
let res = "";
addressesId.forEach((addressId) => {
const address = props.members.find((member) => member.id == addressId);
addressIds.forEach((addressId) => {
const address = props.members?.find((member) => member.id === parseInt(addressId));
if (address) res += address.email;
});
return res;
@ -72,19 +72,19 @@ const displayAddresses = (addressesId) => {
<div class="message">
<div id="context">
<div class="left" id="profile">
{{ displayAddresses(props.data.fromA?.split(",")) }} - {{ props.data.fromA }}
{{ displayAddresses(props.data?.fromA?.split(",")) }} - {{ props.data?.fromA }}
</div>
<div class="middle">{{ decodeEmojis(props.data.subject) }}</div>
<div class="middle">{{ decodeEmojis(props.data?.subject) }}</div>
<div class="right" id="date">
{{
new Date(props.data.date).toLocaleString("en-GB", {
new Date(props.data?.date ?? "").toLocaleString("en-GB", {
weekday: "short",
year: "numeric",
month: "2-digit",
day: "2-digit",
hour: "2-digit",
minute: "2-digit",
timezone: "UTC+1",
timeZone: "Europe/Paris",
})
}}
</div>

View File

@ -1515,6 +1515,14 @@
dependencies:
"@types/node" "*"
"@types/dompurify@^3.0.1":
version "3.0.1"
resolved "https://repo.plus4u.net/operatorGate/repository/public-javascript/@types/dompurify/-/dompurify-3.0.1.tgz"
integrity sha512-ubq8VKmf8W+U48jUOiZO4BoSGS7NnbITPMvrF+7HgMN4L+eezCKv8QBPB8p3o4YPicLMmNeTyDkE5X4c2ViHJQ==
dependencies:
"@types/jsdom" "*"
"@types/trusted-types" "*"
"@types/eslint-scope@^3.7.3":
version "3.7.4"
resolved "https://registry.npmmirror.com/@types/eslint-scope/-/eslint-scope-3.7.4.tgz"
@ -1606,6 +1614,15 @@
jest-matcher-utils "^27.0.0"
pretty-format "^27.0.0"
"@types/jsdom@*":
version "21.1.1"
resolved "https://repo.plus4u.net/operatorGate/repository/public-javascript/@types/jsdom/-/jsdom-21.1.1.tgz"
integrity sha512-cZFuoVLtzKP3gmq9eNosUL1R50U+USkbLtUQ1bYVgl/lKp0FZM7Cq4aIHAL8oIvQ17uSHi7jXPtfDOdjPwBE7A==
dependencies:
"@types/node" "*"
"@types/tough-cookie" "*"
parse5 "^7.0.0"
"@types/json-schema@*", "@types/json-schema@^7.0.4", "@types/json-schema@^7.0.5", "@types/json-schema@^7.0.8", "@types/json-schema@^7.0.9":
version "7.0.11"
resolved "https://registry.npmmirror.com/@types/json-schema/-/json-schema-7.0.11.tgz"
@ -1698,6 +1715,16 @@
resolved "https://repo.plus4u.net/operatorGate/repository/public-javascript/@types/strip-json-comments/-/strip-json-comments-0.0.30.tgz"
integrity sha512-7NQmHra/JILCd1QqpSzl8+mJRc8ZHz3uDm8YV1Ks9IhK0epEiTw8aIErbvH9PI+6XbqhyIQy3462nEsn7UVzjQ==
"@types/tough-cookie@*":
version "4.0.2"
resolved "https://repo.plus4u.net/operatorGate/repository/public-javascript/@types/tough-cookie/-/tough-cookie-4.0.2.tgz"
integrity sha512-Q5vtl1W5ue16D+nIaW8JWebSSraJVlK+EthKn7e7UcD4KWsaSJ8BqGPXNaPghgtcn/fhvrN17Tv8ksUsQpiplw==
"@types/trusted-types@*":
version "2.0.3"
resolved "https://repo.plus4u.net/operatorGate/repository/public-javascript/@types/trusted-types/-/trusted-types-2.0.3.tgz"
integrity sha512-NfQ4gyz38SL8sDNrSixxU2Os1a5xcdFxipAFxYEuLUlvU2uDwS4NUpsImcf1//SlWItCVMMLiylsxbmNMToV/g==
"@types/web-bluetooth@^0.0.16":
version "0.0.16"
resolved "https://repo.plus4u.net/operatorGate/repository/public-javascript/@types/web-bluetooth/-/web-bluetooth-0.0.16.tgz"
@ -3797,6 +3824,11 @@ entities@^2.0.0:
resolved "https://registry.npmmirror.com/entities/-/entities-2.2.0.tgz"
integrity sha512-p92if5Nz619I0w+akJrLZH0MX0Pb5DX39XOwQTtXSdQQOaYH03S1uIQp4mhOZtAXrxq4ViO67YTiLBo2638o9A==
entities@^4.4.0:
version "4.4.0"
resolved "https://repo.plus4u.net/operatorGate/repository/public-javascript/entities/-/entities-4.4.0.tgz"
integrity sha512-oYp7156SP8LkeGD0GF85ad1X9Ai79WtRsZ2gxJqtBuzH+98YUV6jkHEKlZkMbcrjJjIVJNIDP/3WL9wQkoPbWA==
error-ex@^1.3.1:
version "1.3.2"
resolved "https://registry.npmmirror.com/error-ex/-/error-ex-1.3.2.tgz"
@ -6301,6 +6333,13 @@ parse5@^6.0.1:
resolved "https://registry.npmmirror.com/parse5/-/parse5-6.0.1.tgz"
integrity sha512-Ofn/CTFzRGTTxwpNEs9PP93gXShHcTq255nzRYSKe8AkVpZY7e1fpmTfOyoIvjP5HG7Z2ZM7VS9PPhQGW2pOpw==
parse5@^7.0.0:
version "7.1.2"
resolved "https://repo.plus4u.net/operatorGate/repository/public-javascript/parse5/-/parse5-7.1.2.tgz"
integrity sha512-Czj1WaSVpaoj0wbhMzLmWD69anp2WH7FXMB9n1Sy8/ZFF9jolSQVMu1Ij5WIyGmcBmhk7EOndpO4mIpihVqAXw==
dependencies:
entities "^4.4.0"
parse5@6.0.1:
version "6.0.1"
resolved "https://repo.plus4u.net/operatorGate/repository/public-javascript/parse5/-/parse5-6.0.1.tgz"