Skip to content

GitLab

Commit 71afc6c0 authored by Christopher Guindon's avatar Christopher Guindon
Browse files

switch to single quotes for imports 


Signed-off-by: Christopher Guindon's avatarChristopher Guindon <chris.guindon@eclipse-foundation.org>
parent bed33609
Hide whitespace changes
Inline Side-by-side
src/main/js/App.less
View file @ 71afc6c0
......@@ -56,7 +56,7 @@
margin-right: auto;
}
input[type="checkbox"] {
input[type='checkbox'] {
display: inline-block;
width: 30px;
height: 30px;
......@@ -66,7 +66,7 @@
margin-right: 15px;
}
input[type="checkbox"]:checked {
input[type='checkbox']:checked {
background-color: orange;
}
......@@ -74,7 +74,7 @@
display: flex;
align-items: center;
}
input[type="checkbox"]:focus {
input[type='checkbox']:focus {
outline: none !important;
}
......
src/main/js/src/App.css
View file @ 71afc6c0
......@@ -50,7 +50,7 @@
.eclipseFdn-membership-webform .input-group .form-control {
z-index: unset;
}
.eclipseFdn-membership-webform input[type="checkbox"] {
.eclipseFdn-membership-webform input[type='checkbox'] {
display: inline-block;
width: 30px;
height: 30px;
......@@ -59,14 +59,14 @@
margin-top: 0;
margin-right: 15px;
}
.eclipseFdn-membership-webform input[type="checkbox"]:checked {
.eclipseFdn-membership-webform input[type='checkbox']:checked {
background-color: orange;
}
.eclipseFdn-membership-webform .verical-center {
display: flex;
align-items: center;
}
.eclipseFdn-membership-webform input[type="checkbox"]:focus {
.eclipseFdn-membership-webform input[type='checkbox']:focus {
outline: none !important;
}
.eclipseFdn-membership-webform .preview-field {
......
src/main/js/src/App.js
View file @ 71afc6c0
import React, { useState } from "react";
import "./App.css";
import AppFooter from "./components/layout/AppFooter";
import AppHeader from "./components/layout/AppHeader";
import FormWrapper from "./components/FormPreprocess/FormWrapper";
import MembershipContext from "./Context/MembershipContext";
import React, { useState } from 'react';
import './App.css';
import AppFooter from './components/layout/AppFooter';
import AppHeader from './components/layout/AppHeader';
import FormWrapper from './components/FormPreprocess/FormWrapper';
import MembershipContext from './Context/MembershipContext';
const App = () => {
const [currentUser, setCurrentUser] = useState(null);
const [currentFormId, setCurrentFormId] = useState("");
const [currentFormId, setCurrentFormId] = useState('');
return (
<div className="App">
<AppHeader />
......
src/main/js/src/App.test.js
View file @ 71afc6c0
import React from "react";
import { render } from "@testing-library/react";
import App from "./App";
import React from 'react';
import { render } from '@testing-library/react';
import App from './App';
test("renders ef copyright", () => {
test('renders ef copyright', () => {
const { getByText } = render(<App />);
const copyright = getByText(
/Copyright © Eclipse Foundation, Inc. All Rights Reserved./i
......
src/main/js/src/Constants/Constants.js
View file @ 71afc6c0
/**
* list all constants here
*
* The purpose of this file is try to avoid using strings directly everywhere,
*
* The purpose of this file is try to avoid using strings directly everywhere,
* just hope to use consistant variables for strings.
*/
export const api_prefix = "http://localhost:8090";
export const api_prefix_form = "http://localhost:8090/form";
export const api_prefix = 'http://localhost:8090';
export const api_prefix_form = 'http://localhost:8090/form';
export const COMPANY_INFORMATION = "Company Information";
export const MEMBERSHIP_LEVEL = "Membership Level";
export const WORKING_GROUPS = "Working Groups";
export const SIGNING_AUTHORITY = "Signing Authority";
export const REVIEW = "Review";
export const COMPANY_INFORMATION = 'Company Information';
export const MEMBERSHIP_LEVEL = 'Membership Level';
export const WORKING_GROUPS = 'Working Groups';
export const SIGNING_AUTHORITY = 'Signing Authority';
export const REVIEW = 'Review';
export const FETCH_METHOD = {
POST: "POST",
GET: "GET",
PUT: "PUT",
DELETE: "DELETE",
POST: 'POST',
GET: 'GET',
PUT: 'PUT',
DELETE: 'DELETE',
};
export const FETCH_HEADER = {
"Content-Type": "application/json",
Accept: "application/json",
'Content-Type': 'application/json',
Accept: 'application/json',
};
export const membership_levels = [
{ label: "Select a level", value: "" },
{ label: "Strategic Member", value: "strategic" },
{ label: 'Select a level', value: '' },
{ label: 'Strategic Member', value: 'strategic' },
{
label: "Contributing Member (formerly referred to as Solutions Members)",
value: "contributing",
label: 'Contributing Member (formerly referred to as Solutions Members)',
value: 'contributing',
},
{ label: "Associate Member", value: "associate" },
{ label: 'Associate Member', value: 'associate' },
];
export const fakeChildrenArray = [
......@@ -44,28 +44,28 @@ export const fakeChildrenArray = [
];
export const contact_type = {
COMPANY: "COMPANY",
MARKETING: "MARKETING",
ACCOUNTING: "ACCOUNTING",
WORKING_GROUP: "WORKING_GROUP",
COMPANY: 'COMPANY',
MARKETING: 'MARKETING',
ACCOUNTING: 'ACCOUNTING',
WORKING_GROUP: 'WORKING_GROUP',
};
export const end_point = {
organizations: "organizations",
contacts: "contacts",
working_groups: "working_groups",
userinfo: "userinfo",
organizations: 'organizations',
contacts: 'contacts',
working_groups: 'working_groups',
userinfo: 'userinfo',
};
// const for workingGroups string
export const workingGroups = "workingGroups";
export const workingGroups = 'workingGroups';
// const for companies string
export const companies = "companies";
export const companies = 'companies';
export const newForm_tempId = "new";
export const newForm_tempId = 'new';
export const MODE_REACT_ONLY = "MODE_REACT_ONLY";
export const MODE_REACT_API = "MODE_REACT_API";
export const MODE_REACT_ONLY = 'MODE_REACT_ONLY';
export const MODE_REACT_API = 'MODE_REACT_API';
export function getCurrentMode() {
// @todo: need a better way to control this.
......
src/main/js/src/Context/MembershipContext.js
View file @ 71afc6c0
import React from "react";
import React from 'react';
/**
* User and form Id context shared among the whole App
*
* For more about context, please refer to: https://reactjs.org/docs/context.html
*
* It is simliar to state, but you can export and import anywhere,
* It is simliar to state, but you can export and import anywhere,
* no need to pass all the way down to the child component
*/
const MembershipContext = React.createContext({
currentUser: {},
setCurrentUser: () => {},
currentFormId: "",
currentFormId: '',
setCurrentFormId: () => {},
});
......
src/main/js/src/Utils/formFunctionHelpers.js
View file @ 71afc6c0
......@@ -8,7 +8,7 @@ import {
getCurrentMode,
MODE_REACT_ONLY,
MODE_REACT_API,
} from "../Constants/Constants";
} from '../Constants/Constants';
/**
* checkSameContact
......@@ -27,8 +27,8 @@ function checkSameContact(compnayRep, otherContact) {
// Check contacts' name, email and jobtitle to check if they are the same
for (let i = 0; i < keyArray.length; i++) {
if (
keyArray[i] !== "id" &&
keyArray[i] !== "type" &&
keyArray[i] !== 'id' &&
keyArray[i] !== 'type' &&
compnayRep[keyArray[i]] !== otherContact[keyArray[i]]
) {
return false;
......@@ -71,27 +71,27 @@ export function assignContactData(currentContact, companyContact) {
export function matchCompanyFields(existingOrganizationData) {
return {
// Step1: company Info
id: existingOrganizationData?.id || "",
id: existingOrganizationData?.id || '',
legalName:
{
value: existingOrganizationData?.legal_name || "",
label: existingOrganizationData?.legal_name || "",
address: existingOrganizationData?.address || "",
twitterHandle: existingOrganizationData?.twitter_handle || "",
} || "",
value: existingOrganizationData?.legal_name || '',
label: existingOrganizationData?.legal_name || '',
address: existingOrganizationData?.address || '',
twitterHandle: existingOrganizationData?.twitter_handle || '',
} || '',
address: {
id: existingOrganizationData?.address.id || "",
street: existingOrganizationData?.address.street || "",
city: existingOrganizationData?.address.city || "",
provinceOrState: existingOrganizationData?.address.province_state || "",
id: existingOrganizationData?.address.id || '',
street: existingOrganizationData?.address.street || '',
city: existingOrganizationData?.address.city || '',
provinceOrState: existingOrganizationData?.address.province_state || '',
country:
{
label: existingOrganizationData?.address.country,
value: existingOrganizationData?.address.country,
} || "",
postalCode: existingOrganizationData?.address.postal_code || "",
} || '',
postalCode: existingOrganizationData?.address.postal_code || '',
},
twitterHandle: existingOrganizationData?.twitter_handle || "",
twitterHandle: existingOrganizationData?.twitter_handle || '',
};
}
......@@ -128,19 +128,19 @@ export function matchContactFields(existingContactData) {
return {
company: {
id: existingCompanyContact?.id || "",
firstName: existingCompanyContact?.first_name || "",
lastName: existingCompanyContact?.last_name || "",
jobtitle: existingCompanyContact?.job_title || "",
email: existingCompanyContact?.email || "",
id: existingCompanyContact?.id || '',
firstName: existingCompanyContact?.first_name || '',
lastName: existingCompanyContact?.last_name || '',
jobtitle: existingCompanyContact?.job_title || '',
email: existingCompanyContact?.email || '',
},
marketing: {
id: existingMarketingContact?.id || "",
firstName: existingMarketingContact?.first_name || "",
lastName: existingMarketingContact?.last_name || "",
jobtitle: existingMarketingContact?.job_title || "",
email: existingMarketingContact?.email || "",
id: existingMarketingContact?.id || '',
firstName: existingMarketingContact?.first_name || '',
lastName: existingMarketingContact?.last_name || '',
jobtitle: existingMarketingContact?.job_title || '',
email: existingMarketingContact?.email || '',
sameAsCompany: checkSameContact(
existingCompanyContact,
existingMarketingContact
......@@ -148,11 +148,11 @@ export function matchContactFields(existingContactData) {
},
accounting: {
id: existingAccoutingContact?.id || "",
firstName: existingAccoutingContact?.first_name || "",
lastName: existingAccoutingContact?.last_name || "",
jobtitle: existingAccoutingContact?.job_title || "",
email: existingAccoutingContact?.email || "",
id: existingAccoutingContact?.id || '',
firstName: existingAccoutingContact?.first_name || '',
lastName: existingAccoutingContact?.last_name || '',
jobtitle: existingAccoutingContact?.job_title || '',
email: existingAccoutingContact?.email || '',
sameAsCompany: checkSameContact(
existingCompanyContact,
existingAccoutingContact
......@@ -178,25 +178,25 @@ export function matchWorkingGroupFields(
(el) => el.value === item?.working_group_id
);
res.push({
id: item?.id || "",
id: item?.id || '',
workingGroup:
{
label: wg?.label,
value: item?.working_group_id,
participation_levels: wg?.participation_levels,
} || "",
} || '',
participationLevel:
{
label: item?.participation_level,
value: item?.participation_level,
} || "",
effectiveDate: new Date(item?.effective_date) || "",
} || '',
effectiveDate: new Date(item?.effective_date) || '',
workingGroupRepresentative: {
firstName: item?.contact.first_name || "",
lastName: item?.contact.last_name || "",
jobtitle: item?.contact.job_title || "",
email: item?.contact.email || "",
id: item?.contact.id || "",
firstName: item?.contact.first_name || '',
lastName: item?.contact.last_name || '',
jobtitle: item?.contact.job_title || '',
email: item?.contact.email || '',
id: item?.contact.id || '',
},
});
});
......@@ -224,7 +224,7 @@ export function matchCompanyFieldsToBackend(organizationData, formId) {
form_id: formId,
id: organizationData.id,
legal_name: organizationData.legalName.label,
twitter_handle: organizationData.twitterHandle || "",
twitter_handle: organizationData.twitterHandle || '',
};
if (organizationData.address.id) {
......@@ -297,7 +297,7 @@ export function matchWGFieldsToBackend(eachWorkingGroupData, formId) {
participation_level: eachWorkingGroupData?.participationLevel.value,
effective_date: (eachWorkingGroupData?.effectiveDate)
.toISOString()
.replace(/.\d+Z$/g, "Z"),
.replace(/.\d+Z$/g, 'Z'),
contact: {
...wg_contact,
},
......@@ -352,7 +352,7 @@ export async function executeSendDataByStep(step, formData, formId, userId) {
case 1:
sendData(
formId,
"",
'',
matchMembershipLevelFieldsToBackend(
formData.membershipLevel,
formId,
......@@ -389,7 +389,7 @@ export async function executeSendDataByStep(step, formData, formId, userId) {
* If empty, is creating a new entity, use POST method;
* If has value, is fetched from server, use PUT or DELETE;
*/
function callSendData(formId, endpoint = "", method, dataBody, entityId = "") {
function callSendData(formId, endpoint = '', method, dataBody, entityId = '') {
let url = api_prefix_form + `/${formId}`;
if (endpoint) {
......@@ -420,7 +420,7 @@ function callSendData(formId, endpoint = "", method, dataBody, entityId = "") {
/**
* PUT or POST function
*
*
* @param formId -
* Form Id fetched from the server, sotored in membership context, used for calling APIs
* @param endpoint -
......@@ -430,7 +430,7 @@ function callSendData(formId, endpoint = "", method, dataBody, entityId = "") {
* The data body passed to server, normally is the filled form data to be saved
*
* If no data.id, means it's a new data entry, we should use POST. otherwise, use PUT
*/
*/
export function sendData(formId, endpoint, dataBody) {
switch (endpoint) {
case end_point.organizations:
......@@ -454,7 +454,7 @@ export function sendData(formId, endpoint, dataBody) {
/**
* DELETE
*
*
* @param formId - Form Id fetched from the server, sotored in membership context, used for calling APIs
* @param endpoint - To which endpoint the fetch is calling to backend:
* /form/{id}, /form/{id}/organizations/{id}, /form/{id}/contacts/{id}, /form/{id}/working_groups/{id}
......@@ -464,7 +464,7 @@ export function sendData(formId, endpoint, dataBody) {
* @param callback - Callback function, called when fetch resolved
* @param index - Typically for working groups, which one is deleted
* Typically is used by the callback function from WorkingGroup Component (arrayhelpers.remove())
*/
*/
export function deleteData(formId, endpoint, entityId, callback, index) {
// If the added field array is not in the server, just remove it from frontend
if (!entityId) {
......@@ -499,7 +499,7 @@ export function deleteData(formId, endpoint, entityId, callback, index) {
}
/**
* Handle New Form
*
*
* @param setCurrentFormId - setCurrentFormId function from membership context
* @param formData - Filled whole form data stored in formik context
* @param userId - User Id fetched from the server when sign in, sotored in membership context, used for calling APIs
......@@ -522,7 +522,7 @@ export async function handleNewForm(
if (getCurrentMode() === MODE_REACT_API) {
var dataBody = {
membership_level: "",
membership_level: '',
signing_authority: false,
};
......
src/main/js/src/components/FormComponents/CompanyInformation/Company.js
View file @ 71afc6c0
import React from "react";
import CustomSelectWrapper from "../Inputs/CustomSelect/CustomSelectWrapper";
import DefaultSelect from "../Inputs/CustomSelect/DefaultSelect";
import CustomAsyncSelect from "../Inputs/CustomSelect/CustomAsyncSelect";
import Input from "../Inputs/Input";
import { formField } from "../formModels/formFieldModel";
import { companies } from "../../../Constants/Constants";
import React from 'react';
import CustomSelectWrapper from '../Inputs/CustomSelect/CustomSelectWrapper';
import DefaultSelect from '../Inputs/CustomSelect/DefaultSelect';
import CustomAsyncSelect from '../Inputs/CustomSelect/CustomAsyncSelect';
import Input from '../Inputs/Input';
import { formField } from '../formModels/formFieldModel';
import { companies } from '../../../Constants/Constants';
/**
* Render Oraganization selector (used React-Select)
......@@ -21,15 +21,15 @@ const Company = () => {
organizationAddress,
} = formField;
// get country list library and map as option pass to the React-Select
const countryList = require("country-list")
const countryList = require('country-list')
.getNames()
.map((item) => ({ label: item, value: item }));
return (
<>
<h2 className="fw-600 h4" id={organizationName.name}>
{" "}
Organization <span className="orange-star">*</span>{" "}
{' '}
Organization <span className="orange-star">*</span>{' '}
</h2>
<CustomSelectWrapper
name={organizationName.name}
......
src/main/js/src/components/FormComponents/CompanyInformation/CompanyInformation.js
View file @ 71afc6c0
import React, { useContext, useEffect, useState } from "react";
import MembershipContext from "../../../Context/MembershipContext";
import React, { useContext, useEffect, useState } from 'react';
import MembershipContext from '../../../Context/MembershipContext';
import {
matchCompanyFields,
matchContactFields,
} from "../../../Utils/formFunctionHelpers";
import Company from "./Company";
import Contacts from "./Contacts";
import Loading from "../../Loading/Loading";
} from '../../../Utils/formFunctionHelpers';
import Company from './Company';
import Contacts from './Contacts';
import Loading from '../../Loading/Loading';
import {
end_point,
api_prefix_form,
......@@ -15,17 +15,17 @@ import {
getCurrentMode,
MODE_REACT_ONLY,
MODE_REACT_API,
} from "../../../Constants/Constants";
} from '../../../Constants/Constants';
/**
* Wrapper for Contacts and Company components
*
* Wrapper for Contacts and Company components,
*
* Wrapper for Contacts and Company components,
* with fetch and prefill data operation.
*
*
* Props:
* - otherProps: any other props passing down from MultiStepForm and
* FormikStepper components, including formik props of formik
* - otherProps: any other props passing down from MultiStepForm and
* FormikStepper components, including formik props of formik
* library (such as "formik.values", "formik.setFieldValue");
* - formField: the form field in formModels/formFieldModel.js
*/
......@@ -35,24 +35,24 @@ const CompanyInformation = ({ formField, ...otherProps }) => {
const { setFieldValue } = otherProps.parentState.formik;
const [loading, setLoading] = useState(true);
// Fetch data only once and prefill data,
// as long as currentFormId and setFieldValue
// Fetch data only once and prefill data,
// as long as currentFormId and setFieldValue
// Function does not change, will not cause re-render again
useEffect(() => {
// Once we have API set up ready, we don't need the
// fake data anymore, and can remove these pre-process.
// it is mainly for if running the application
// Once we have API set up ready, we don't need the
// fake data anymore, and can remove these pre-process.
// it is mainly for if running the application
// only react without server.
let url_prefix_local;
let url_suffix_local = "";
let url_suffix_local = '';
// If running on localhost:3000
if (getCurrentMode() === MODE_REACT_ONLY) {
url_prefix_local = "membership_data"; // --> public/membership_data/
url_suffix_local = ".json"; // --> it is the fake json file
url_prefix_local = 'membership_data'; // --> public/membership_data/
url_suffix_local = '.json'; // --> it is the fake json file
}
// If running on localhost:8090 or any other not on localhost:3000
// Once we have the API ready running on production,
// Once we have the API ready running on production,
// will use the correct domain name rather than localhost:8090
if (getCurrentMode() === MODE_REACT_API) {
url_prefix_local = api_prefix_form;
......@@ -60,7 +60,7 @@ const CompanyInformation = ({ formField, ...otherProps }) => {
// If the current form exsits, and it is not creating a new form
if (currentFormId && currentFormId !== newForm_tempId) {
// Using promise pool, because in first step,
// Using promise pool, because in first step,
// need to get company data, and contacts data
let pool = [
fetch(
......@@ -84,27 +84,27 @@ const CompanyInformation = ({ formField, ...otherProps }) => {
.then(([organizations, contacts]) => {
// Matching the field data
if (organizations[0]) {
// the organization data returned is always an
// the organization data returned is always an
// array of one object, that is why using [0]
// Call the the function to map the retrived
// Call the the function to map the retrived
// organization backend data to fit frontend
let tempOrg = matchCompanyFields(organizations[0]);
console.log(tempOrg);
// Call the setFieldValue of Formik, to set
// organization field with the mapped data,
// if nested, it will automatically map the
// Call the setFieldValue of Formik, to set
// organization field with the mapped data,
// if nested, it will automatically map the
// properties and values
setFieldValue("organization", tempOrg);
setFieldValue('organization', tempOrg);
}
if (contacts.length) {
// Call the the function to map the retrived contacts
// (company representative, marketing rep, accounting rep)
// Call the the function to map the retrived contacts
// (company representative, marketing rep, accounting rep)