diff --git a/.gitignore b/.gitignore index f585f6d..0dc9652 100644 --- a/.gitignore +++ b/.gitignore @@ -33,4 +33,5 @@ cypress/screenshots /storybook-static # npx tsc compilation -/dist-tsc \ No newline at end of file +/dist-tsc +/dist diff --git a/Dockerfile b/Dockerfile new file mode 100644 index 0000000..77f6e3d --- /dev/null +++ b/Dockerfile @@ -0,0 +1,11 @@ +FROM node:19 + +RUN mkdir -p /app + +WORKDIR /app +COPY . /app + +RUN npm install +RUN npm run build + +CMD ["npm", "run", "preview", "--", "--host"] diff --git a/README.md b/README.md index b6bd68a..0b2e86c 100644 --- a/README.md +++ b/README.md @@ -2,10 +2,20 @@ This is the main UI for Cosmian CipherCompute and ZeroTrust # Cosmian Anonymization Configuration tool -## Start application +## Start application locally ``` npm run dev ``` -Then open [http://localhost:3001](http://localhost:3001) to view it in the browser. +Then open [http://localhost:5173](http://localhost:5173) to view it in the browser. + + +## Start application using Docker + +``` +docker build -t anonymization-tool . +docker run -p 4173:4173 anonymization-tool +``` + +Then open [http://localhost:4173](http://localhost:4173) to view it in the browser. diff --git a/package-lock.json b/package-lock.json index 3e792b4..09285eb 100644 --- a/package-lock.json +++ b/package-lock.json @@ -10,7 +10,7 @@ "dependencies": { "antd": "^4.24.7", "cloudproof_js": "^9.0.0", - "cosmian_ui": "^0.0.44", + "cosmian_ui": "^0.0.49", "eslint-plugin-react": "^7.32.2", "joi": "^17.9.1", "less": "^4.1.3", @@ -3812,9 +3812,9 @@ } }, "node_modules/cosmian_ui": { - "version": "0.0.44", - "resolved": "https://registry.npmjs.org/cosmian_ui/-/cosmian_ui-0.0.44.tgz", - "integrity": "sha512-xuh7ENSWMlBEoWbDmW1G9wP2KscD7cXF7Gq2X0VSIj35EOKs5RC9m0nVtXMk78dm853h0cVigFDNWy84W+JkkQ==", + "version": "0.0.49", + "resolved": "https://registry.npmjs.org/cosmian_ui/-/cosmian_ui-0.0.49.tgz", + "integrity": "sha512-9nZM4dLqCTdAzaj59YuIR0cME/Dtz9879vvGvB1qmErNh4r0UdPeMk5Sys6jt378xWEm1fmPHPzTshk9xi40Kg==", "dependencies": { "antd": "^4.24.4", "json": "^11.0.0", diff --git a/package.json b/package.json index a204ca1..3e9d95d 100644 --- a/package.json +++ b/package.json @@ -11,7 +11,7 @@ "dependencies": { "antd": "^4.24.7", "cloudproof_js": "^9.0.0", - "cosmian_ui": "^0.0.44", + "cosmian_ui": "^0.0.49", "eslint-plugin-react": "^7.32.2", "joi": "^17.9.1", "less": "^4.1.3", diff --git a/src/Views/Edit.tsx b/src/Views/Edit.tsx index 1ec5d64..189c2df 100644 --- a/src/Views/Edit.tsx +++ b/src/Views/Edit.tsx @@ -1,5 +1,5 @@ import { DownloadOutlined, EditOutlined } from "@ant-design/icons" -import { Skeleton, Table, Tag, Typography, notification } from "antd" +import { Skeleton, Space, Table, Tag, Typography, notification } from "antd" import { BackArrow, Button, RoundedFrame } from "cosmian_ui" import localForage from "localforage" import { Key, useEffect, useState } from "react" @@ -29,7 +29,6 @@ const Edit = (): JSX.Element => { const [selectedRowKeys, setSelectedRowKeys] = useState([]) const [configurationInfo, setConfigurationInfo] = useState() const [fileMetadata, setFileMetadata] = useState(undefined) - const [screenHeight, setScreenHeight] = useState(getTableHeight(window.innerHeight)) useEffect(() => { const fetchConfig = async (): Promise => { @@ -42,10 +41,6 @@ const Edit = (): JSX.Element => { fetchConfig() }, []) - addEventListener("resize", (_event) => { - setScreenHeight(getTableHeight(window.innerHeight)) - }) - const columns = [ { title: "Column name", @@ -185,7 +180,12 @@ const Edit = (): JSX.Element => { > {configurationInfo?.name} -

Select column(s) and define method to apply.

+ +

Select column(s) and define method to apply.

+ +
{ pagination={false} rowSelection={rowSelection} tableLayout="auto" - scroll={{ x: 800, y: screenHeight }} + scroll={{ x: 800 }} /> -
- -
{ } export default Edit - -const getTableHeight = (windowHeight: number): number => { - return windowHeight - 500 > 200 ? windowHeight - 500 : 200 -} diff --git a/src/utils/utils.ts b/src/utils/utils.ts index 0a7d230..862d28a 100644 --- a/src/utils/utils.ts +++ b/src/utils/utils.ts @@ -1,8 +1,9 @@ /* eslint-disable @typescript-eslint/no-explicit-any */ -import { Anonymization, Fpe } from "cloudproof_js" +// import { Anonymization, Fpe } from "cloudproof_js" import { notification } from "antd" import { DefaultOptionType } from "antd/lib/select" +import { Anonymization, Fpe } from "cloudproof_js" import localForage from "localforage" export type MetaData = { @@ -117,10 +118,48 @@ export const getCommonMethods = (types: DataType[]): DefaultOptionType[] => { return [] } -const FPE = await Fpe() -const anonymization = await Anonymization() -const key = crypto.getRandomValues(new Uint8Array(32)) -const tweak = crypto.getRandomValues(new Uint8Array(1024)) +const key = new Uint8Array([ + 156, 161, 173, 90, 39, 41, 113, 3, 99, 144, 48, 69, 70, 3, 86, 154, 39, 215, 6, 55, 242, 50, 149, 176, 242, 31, 123, 180, 97, 129, 141, + 232, +]) +const tweak = new Uint8Array([ + 27, 195, 246, 165, 228, 175, 100, 67, 97, 148, 12, 138, 27, 120, 179, 58, 55, 186, 239, 236, 5, 177, 11, 14, 164, 148, 244, 103, 182, 156, + 178, 227, 68, 16, 226, 200, 44, 163, 93, 250, 175, 101, 3, 146, 88, 44, 163, 37, 107, 150, 110, 246, 252, 170, 237, 158, 170, 11, 88, 34, + 113, 91, 159, 16, 37, 171, 254, 177, 157, 87, 219, 214, 243, 58, 47, 195, 131, 133, 215, 22, 178, 0, 237, 246, 204, 118, 206, 170, 152, + 121, 184, 38, 203, 109, 178, 131, 173, 74, 185, 132, 58, 26, 3, 58, 124, 198, 242, 1, 244, 245, 154, 198, 178, 139, 238, 253, 206, 236, + 111, 78, 219, 1, 91, 237, 171, 235, 54, 229, 209, 119, 2, 113, 75, 84, 94, 25, 214, 87, 239, 79, 48, 56, 35, 150, 159, 207, 246, 200, 15, + 23, 226, 4, 80, 178, 115, 233, 175, 249, 220, 94, 129, 100, 79, 28, 118, 183, 222, 48, 192, 4, 224, 30, 108, 32, 160, 225, 2, 21, 58, 230, + 206, 230, 87, 60, 22, 174, 5, 181, 161, 200, 216, 80, 5, 5, 123, 59, 146, 88, 223, 48, 22, 34, 195, 141, 225, 74, 180, 228, 101, 82, 106, + 86, 144, 106, 27, 123, 119, 147, 46, 125, 134, 89, 161, 153, 77, 99, 209, 116, 152, 114, 191, 141, 119, 244, 176, 88, 252, 208, 151, 37, + 186, 98, 147, 144, 42, 180, 51, 32, 239, 36, 30, 184, 11, 58, 70, 116, 132, 215, 172, 66, 58, 210, 105, 3, 220, 130, 149, 14, 63, 91, 63, + 143, 175, 21, 78, 80, 8, 183, 166, 227, 241, 28, 206, 177, 223, 81, 68, 136, 156, 229, 33, 142, 3, 228, 201, 109, 61, 11, 100, 50, 216, + 164, 158, 36, 92, 112, 213, 108, 181, 23, 122, 34, 208, 242, 194, 159, 72, 172, 107, 173, 48, 254, 122, 9, 202, 164, 156, 163, 9, 38, 91, + 137, 133, 102, 98, 37, 179, 81, 44, 69, 18, 249, 244, 247, 28, 42, 195, 252, 147, 202, 254, 215, 215, 235, 100, 176, 123, 255, 78, 111, + 97, 27, 159, 119, 37, 122, 96, 93, 25, 136, 183, 76, 101, 112, 22, 224, 230, 178, 137, 195, 157, 154, 20, 231, 148, 133, 163, 67, 148, + 154, 201, 203, 60, 33, 229, 98, 34, 112, 91, 77, 193, 81, 202, 33, 230, 124, 76, 54, 167, 6, 33, 170, 203, 17, 149, 171, 14, 55, 249, 217, + 32, 235, 66, 9, 148, 156, 181, 182, 89, 216, 122, 103, 198, 25, 170, 112, 154, 149, 121, 125, 11, 180, 157, 160, 243, 205, 110, 81, 190, + 3, 176, 13, 0, 197, 254, 9, 134, 119, 26, 163, 235, 119, 63, 224, 210, 174, 130, 163, 153, 106, 19, 53, 11, 7, 1, 252, 122, 133, 245, 225, + 71, 76, 172, 34, 39, 103, 109, 88, 90, 25, 103, 238, 231, 167, 198, 187, 118, 104, 17, 204, 15, 247, 223, 7, 231, 100, 0, 5, 121, 124, + 248, 69, 4, 242, 165, 249, 71, 147, 163, 45, 169, 35, 78, 180, 125, 16, 127, 17, 230, 47, 221, 249, 246, 36, 114, 253, 2, 40, 54, 61, 167, + 50, 86, 238, 1, 123, 129, 101, 167, 111, 23, 231, 13, 207, 229, 235, 116, 16, 151, 36, 142, 149, 141, 132, 12, 140, 206, 32, 157, 195, 79, + 30, 54, 149, 178, 223, 91, 56, 110, 243, 0, 216, 118, 203, 2, 241, 14, 108, 108, 116, 40, 255, 136, 249, 218, 241, 130, 124, 49, 95, 99, + 42, 86, 50, 165, 244, 134, 98, 141, 69, 168, 50, 149, 29, 84, 151, 194, 87, 26, 30, 18, 217, 200, 109, 168, 109, 100, 211, 136, 87, 60, + 242, 142, 213, 12, 168, 158, 148, 54, 184, 72, 144, 88, 11, 138, 83, 232, 4, 89, 63, 229, 86, 63, 151, 198, 215, 211, 194, 146, 123, 252, + 24, 156, 65, 13, 218, 101, 45, 64, 39, 164, 235, 161, 19, 115, 175, 198, 194, 156, 59, 68, 10, 148, 0, 75, 130, 123, 192, 86, 158, 188, + 226, 238, 233, 208, 63, 229, 90, 239, 95, 16, 20, 136, 50, 30, 47, 106, 200, 100, 184, 251, 230, 244, 156, 4, 78, 149, 250, 7, 47, 24, + 163, 63, 99, 217, 39, 70, 239, 92, 66, 8, 155, 211, 228, 242, 153, 236, 238, 175, 210, 241, 1, 231, 159, 31, 6, 83, 22, 36, 213, 139, 71, + 241, 187, 41, 94, 137, 241, 228, 190, 159, 175, 103, 98, 28, 92, 156, 220, 229, 34, 232, 185, 209, 86, 108, 149, 187, 105, 237, 93, 194, + 246, 61, 57, 164, 31, 17, 255, 37, 166, 167, 70, 213, 226, 156, 12, 125, 155, 28, 222, 96, 199, 220, 122, 245, 56, 184, 55, 161, 88, 208, + 207, 228, 110, 116, 111, 86, 195, 179, 200, 153, 156, 47, 11, 63, 67, 209, 217, 245, 235, 233, 28, 8, 184, 149, 206, 130, 95, 195, 41, 3, + 2, 214, 22, 24, 10, 164, 245, 216, 66, 65, 1, 215, 178, 188, 187, 213, 228, 46, 220, 228, 104, 237, 92, 120, 224, 69, 103, 44, 109, 101, + 254, 60, 25, 77, 138, 29, 220, 195, 105, 133, 160, 195, 108, 26, 218, 255, 111, 251, 12, 148, 172, 217, 86, 206, 143, 12, 227, 16, 17, + 176, 67, 86, 0, 188, 151, 140, 70, 91, 157, 137, 53, 68, 107, 66, 155, 83, 147, 164, 102, 116, 69, 10, 50, 156, 212, 251, 199, 12, 135, + 91, 49, 151, 171, 236, 253, 44, 120, 193, 211, 115, 1, 223, 59, 188, 11, 118, 91, 199, 68, 107, 150, 235, 184, 173, 31, 33, 21, 19, 221, + 228, 150, 46, 129, 237, 215, 32, 149, 53, 58, 208, 52, 114, 43, 210, 81, 187, 197, 148, 193, 106, 115, 64, 214, 107, 130, 21, 84, 254, + 165, 84, 132, 94, 242, 194, 246, 130, 216, 50, 193, 146, 96, 67, 101, 135, 52, 125, 76, 59, 81, 199, 38, 48, 241, 252, 209, 205, 114, 110, + 62, 0, 238, 226, 76, +]) + interface FpeOptions { alphabet?: string additionalCharacters?: string @@ -129,6 +168,8 @@ interface FpeOptions { } export const applyMethod = async (clearInput: string | number, method: MethodType, methodOptions: any): Promise => { + const FPE = await Fpe() + const anonymization = await Anonymization() if (!methodOptions) return undefined switch (method) { case "FpeString": {