Merge pull request #66 from PoCInnovation/dev

Computing v1 & Storage file change

.env.example

@@ -1 +1,2 @@
-REACT_APP_ALEPH_CHANNEL=TEST
+REACT_APP_ALEPH_CHANNEL=TEST
+PORT=8080

.github/getting-started.md

@@ -10,7 +10,7 @@ In this part, you will configure your project.
 
 ### Branches
 
-Branch protection is really important. It helps you to have controle on your code.
+Branch protection is really important. It helps you to have control on your code.
 
 For each of the following branches, add the required protections.
 
@@ -153,11 +153,11 @@ There are three parts :
 - Final Report
   > **:warning: It's checklist must be completed before starting a new sprint :warning:**
 
-Additional informations are written in the milestones's checklists. Read them carefully !
+Additional information is written in the milestones's checklists. Read them carefully !
 
 ### Issues
 
-Create all the required issues of a sprint before starting it. Once the sprint started, no issue linked to it should be create.
+Create all the required issues of a sprint before starting it. Once the sprint started, no issue linked to it should be created.
 
 **Each issue must be linked to a milestone and a GitHub project, have the right labels and be assigned to someone.**
 
@@ -185,13 +185,13 @@ Tag pull requests with the `patch`, `minor` or `major` labels.
 
 ### Discord Webhook
 
-We strongly advice you to have a discord channel on wich you will receive GitHub updates on your project.
+We strongly advise you to have a discord channel on which you will receive GitHub updates on your project.
 
 Follow this [tutorial](https://gist.github.com/SGTGunner/50d6a3cc0d489cf779f77695ba3e22ea).
 
 ### Security dependabot
 
-We strongly advice you to have a security dependabot to fix vulnerable dependencies.
+We strongly advise you to have a security dependabot to fix vulnerable dependencies.
 
 Follow this [tutorial](https://docs.github.com/en/code-security/dependabot/dependabot-security-updates/configuring-dependabot-security-updates#managing-dependabot-security-updates-for-your-repositories).
 

README.md

@@ -190,7 +190,7 @@ We use [Aleph SDK TS](https://github.com/aleph-im/aleph-sdk-ts#readme).
 ---
 
 - The content is retrieved from the aleph network from his hash.
-- The content is decrypt with the key, itself decrypt with the private key of the user.
+- The content is decrypted with the key, itself decrypted with the private key of the user.
 
 <details>
     <summary>Download a file</summary>

cypress/integration/dashboard.spec.js

@@ -30,12 +30,12 @@ describe('Upload a file modal for DashboardView', () => {
 		cy.get('#ipc-dashboardView-upload-file').attachFile(fixtureFile);
 		cy.get('#ipc-dashboardView-upload-file-modal-button').click();
 		cy.wait(2000);
-		cy.get('button').should('have.length', 8);
+		cy.get('button').should('have.length', 12);
 	});
 
 	it('Good number of buttons after closing modal', () => {
 		cy.get('#ipc-modal-close-button').click();
-		cy.get('button').should('have.length', 8);
+		cy.get('button').should('have.length', 12);
 	});
 });
 

cypress/integration/dashboardFront.spec.js

@@ -47,7 +47,7 @@ describe('Good Modal Front for DashboardView', () => {
 	});
 
 	it('Good number of buttons', () => {
-		cy.get('button').should('have.length', 8);
+		cy.get('button').should('have.length', 10);
 	});
 
 	it('Good number of input', () => {

cypress/integration/uploadProgram.js

@@ -0,0 +1,40 @@
+let dashboardSpecMnemonic = '';
+
+describe('Create account for DashboardView tests', () => {
+	it('Connect', () => {
+		cy.visit('/signup');
+		cy.wait(1000);
+		cy.get('#ipc-signupView-credentials-signup-button').click();
+		cy.get('#ipc-signupView-text-area')
+			.invoke('val')
+			.then((input) => {
+				dashboardSpecMnemonic = input;
+			});
+		cy.get('#ipc-modal-close-button').click();
+	});
+});
+
+describe('Upload a program modal for DashboardView', () => {
+	const fixtureFile = 'upload_test_program.zip';
+
+	beforeEach(() => {
+		cy.visit('/login');
+		cy.wait(1000);
+		cy.get('#ipc-loginView-text-area').click().type(dashboardSpecMnemonic);
+		cy.get('#ipc-loginView-credentials-button').click().wait(3000);
+		cy.get('#ipc-dashboardView-drawer-button').click({ force: true });
+		cy.get('#ipc-deploy-button').click().wait(2500);
+	});
+
+	it('Good number of buttons after upload', () => {
+		cy.get('#ipc-dashboardView-upload-program').attachFile(fixtureFile);
+		cy.get('#ipc-dashboardView-upload-program-modal-button').click();
+		cy.wait(2000);
+		cy.get('button').should('have.length', 10);
+	});
+
+	it('Good number of buttons after closing modal', () => {
+		cy.get('#ipc-modal-close-button').click();
+		cy.get('button').should('have.length', 10);
+	});
+});

package.json

@@ -3,32 +3,26 @@
   "version": "0.1.0",
   "private": true,
   "dependencies": {
-    "@chakra-ui/icons": "^1.0.15",
+    "@babel/core": "^7.18.2",
+    "@chakra-ui/icons": "^1.1.7",
     "@chakra-ui/react": "^1.6.6",
+    "@chakra-ui/system": "^1.6.6",
     "@chakra-ui/theme-tools": "^1.1.9",
     "@emotion/react": "^11.4.1",
     "@emotion/styled": "^11.3.0",
-    "@heroicons/react": "^1.0.1",
-    "@testing-library/jest-dom": "^5.14.1",
-    "@testing-library/react": "^11.2.7",
-    "@testing-library/user-event": "^12.8.3",
     "aleph-sdk-ts": "^2.2.1",
     "crypto-js": "^4.0.0",
     "env-var": "^7.1.1",
     "eth-crypto": "^2.2.0",
     "ethers": "^5.5.2",
     "framer-motion": "^4.1.17",
-    "it-all": "^1.0.5",
-    "it-concat": "^1.0.3",
     "js-file-download": "^0.4.12",
     "react": "^17.0.2",
-    "react-clipboard.js": "^2.0.16",
     "react-dom": "^17.0.2",
     "react-icons": "^4.3.1",
     "react-router-dom": "^5.2.0",
     "react-scripts": "4.0.3",
     "typescript": "^4.3.4",
-    "web-vitals": "^1.1.2",
     "web3": "^1.5.0"
   },
   "scripts": {
@@ -70,7 +64,6 @@
     "eslint-config-airbnb-typescript": "^12.3.1",
     "eslint-config-prettier": "^8.3.0",
     "eslint-plugin-prettier": "^3.4.0",
-    "postcss": "^8.3.6",
     "prettier": "^2.3.2"
   }
 }

src/components/CustomButtons.tsx

@@ -7,7 +7,7 @@ type UploadButtonProps = {
 };
 
 export const UploadButton = ({ text, onClick, isLoading }: UploadButtonProps): JSX.Element => (
-	<Button variant="inline" borderRadius="lg" onClick={onClick} isLoading={isLoading} id="ipc-upload-button">
+	<Button variant="inline" w="80%" borderRadius="lg" onClick={onClick} isLoading={isLoading} id="ipc-upload-button">
 		{text}
 	</Button>
 );
@@ -17,3 +17,9 @@ export const ContactButton = ({ text, onClick, isLoading }: UploadButtonProps):
 		{text}
 	</Button>
 );
+
+export const DeployButton = ({ text, onClick, isLoading }: UploadButtonProps): JSX.Element => (
+	<Button variant="inline" w="80%" borderRadius="lg" onClick={onClick} isLoading={isLoading} id="ipc-deploy-button">
+		{text}
+	</Button>
+);

src/components/DisplayFileCards.tsx

@@ -1,36 +1,45 @@
 import React from 'react';
-import { IPCContact, IPCFile } from '../types/types';
+import { IPCContact, IPCFile, IPCProgram } from '../types/types';
 import { FileCards } from './FileCards';
+import { ProgramCards } from './ProgramCards';
 import { ContactCards } from './ContactCards';
 import { ProfileCard } from './ProfileCard';
 
 type FileCardsProps = {
 	myFiles: IPCFile[];
+	myPrograms: IPCProgram[];
 	sharedFiles: IPCFile[];
 	contacts: IPCContact[];
 	index: number;
 	downloadFile: (file: IPCFile) => Promise<void>;
 	isDownloadLoading: boolean;
+	isUpdateLoading: boolean;
 	setSelectedFile: React.Dispatch<React.SetStateAction<IPCFile>>;
 	onOpenShare: () => void;
 	setContactInfo: React.Dispatch<React.SetStateAction<IPCContact>>;
 	onOpenContactUpdate: () => void;
 	onOpenContactAdd: () => void;
+	onOpenUpdateFileName: () => void;
+	onOpenUpdateFileContent: () => void;
 	deleteContact: (contactToDelete: IPCContact) => Promise<void>;
 };
 
 export const DisplayFileCards = ({
 	myFiles,
+	myPrograms,
 	sharedFiles,
 	contacts,
 	index,
 	downloadFile,
 	isDownloadLoading,
+	isUpdateLoading,
 	setSelectedFile,
 	onOpenShare,
 	setContactInfo,
 	onOpenContactUpdate,
 	onOpenContactAdd,
+	onOpenUpdateFileName,
+	onOpenUpdateFileContent,
 	deleteContact,
 }: FileCardsProps): JSX.Element => {
 	if (index === 0)
@@ -39,8 +48,11 @@ export const DisplayFileCards = ({
 				files={myFiles}
 				downloadFile={downloadFile}
 				isDownloadLoading={isDownloadLoading}
+				isUpdateLoading={isUpdateLoading}
 				setSelectedFile={setSelectedFile}
 				onOpenShare={onOpenShare}
+				onOpenUpdateFileName={onOpenUpdateFileName}
+				onOpenUpdateFileContent={onOpenUpdateFileContent}
 			/>
 		);
 	if (index === 1)
@@ -49,8 +61,11 @@ export const DisplayFileCards = ({
 				files={sharedFiles}
 				downloadFile={downloadFile}
 				isDownloadLoading={isDownloadLoading}
+				isUpdateLoading={isUpdateLoading}
 				setSelectedFile={setSelectedFile}
 				onOpenShare={onOpenShare}
+				onOpenUpdateFileName={onOpenUpdateFileName}
+				onOpenUpdateFileContent={onOpenUpdateFileContent}
 			/>
 		);
 	if (index === 2)
@@ -63,6 +78,7 @@ export const DisplayFileCards = ({
 				deleteContact={deleteContact}
 			/>
 		);
+	if (index === 3) return <ProgramCards programs={myPrograms} />;
 	return (
 		<ProfileCard profile={contacts[0]} setContactInfo={setContactInfo} onOpenContactUpdate={onOpenContactUpdate} />
 	);

src/components/FileCards.tsx

@@ -3,25 +3,32 @@ import { DownloadIcon } from '@chakra-ui/icons';
 import { MdPeopleAlt } from 'react-icons/md';
 import React from 'react';
 import FileCard from './FileCard';
+import { FileEditButtons } from './FileEditButtons';
 import { IPCFile } from '../types/types';
 
 type FileCardsProps = {
 	files: IPCFile[];
 	downloadFile: (file: IPCFile) => Promise<void>;
 	isDownloadLoading: boolean;
+	isUpdateLoading: boolean;
 	setSelectedFile: React.Dispatch<React.SetStateAction<IPCFile>>;
 	onOpenShare: () => void;
+	onOpenUpdateFileName: () => void;
+	onOpenUpdateFileContent: () => void;
 };
 
 export const FileCards = ({
 	files,
 	downloadFile,
 	isDownloadLoading,
+	isUpdateLoading,
 	setSelectedFile,
 	onOpenShare,
+	onOpenUpdateFileName,
+	onOpenUpdateFileContent,
 }: FileCardsProps): JSX.Element => (
 	<>
-		{files.map((file) => (
+		{files.map((file: IPCFile) => (
 			<FileCard key={file.created_at} file={file}>
 				<>
 					<Button
@@ -51,6 +58,13 @@ export const FileCards = ({
 					>
 						<Icon as={MdPeopleAlt} />
 					</Button>
+					<FileEditButtons
+						file={file}
+						isUpdateLoading={isUpdateLoading}
+						setSelectedFile={setSelectedFile}
+						onOpenUpdateFileName={onOpenUpdateFileName}
+						onOpenUpdateFileContent={onOpenUpdateFileContent}
+					/>
 				</>
 			</FileCard>
 		))}