Skip to content

Commit

Permalink
ticket+build
Browse files Browse the repository at this point in the history
  • Loading branch information
svetaStrech committed Nov 16, 2023
1 parent bb2eeb0 commit 935f2de
Show file tree
Hide file tree
Showing 25 changed files with 547 additions and 216 deletions.
13 changes: 13 additions & 0 deletions ui_src/src/assets/images/lockIcon.svg
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
2 changes: 2 additions & 0 deletions ui_src/src/const/apiEndpoints.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -39,6 +39,7 @@ export const ApiEndpoints = {
GET_STATIONS: '/stations/getStations',
GET_POISON_MESSAGE_JOURNEY: '/stations/getPoisonMessageJourney',
GET_MESSAGE_DETAILS: '/stations/getMessageDetails',
GET_ATTACHED_FUNCTION_DLS_MSG: '/getAttachedFunctionDlsMsgs',
DROP_DLS_MESSAGE: '/stations/dropDlsMessages',
REMOVE_MESSAGES: '/stations/removeMessages',
PURGE_STATION: '/stations/purgeStation',
Expand Down Expand Up @@ -102,6 +103,7 @@ export const ApiEndpoints = {
GET_FUNCTION_DETAIL: '/functions/getFunctionDetails',
GET_FUNCTION_FILE_CODE: '/functions/getFunctionFileCode',
TEST_FUNCTION: '/functions/testFunction',
GET_ATTACHED_FUNCTION_LOGS: '/monitoring/stations/getAttachedFunctionLogs',

//Integrations
CREATE_INTEGRATION: '/integrations/createIntegration',
Expand Down
19 changes: 11 additions & 8 deletions ui_src/src/domain/administration/integrations/components/gitHubIntegration/index.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -76,7 +76,7 @@ const GitHubIntegration = ({ close, value }) => {
setImagesLoaded(true);
});
getIntegration();
}, [value]);
}, []);

function areEqual(arr1, arr2) {
if (arr1?.length !== arr2?.length) {
Expand Down Expand Up @@ -118,8 +118,9 @@ const GitHubIntegration = ({ close, value }) => {

const removeRepoItem = (index) => {
let updatedValue = { ...formFields.keys };
updatedValue.connected_repos.splice(index, 1);
updatedValue?.connected_repos?.splice(index, 1);
setFormFields((formFields) => ({ ...formFields, keys: updatedValue }));
updateIntegration(updatedValue);
};

const updateKeysState = (field, value) => {
Expand All @@ -138,8 +139,7 @@ const GitHubIntegration = ({ close, value }) => {
showMessages('success', disconnect ? 'The integration was successfully disconnected' : 'The integration connected successfully');
};

const updateIntegration = async () => {
setLoadingSubmit(true);
const updateIntegration = async (updatedValue) => {
const updatedFields = cleanEmptyFields();
try {
const data = await httpRequest('POST', ApiEndpoints.UPDATE_INTEGRATION, updatedFields);
Expand All @@ -161,9 +161,7 @@ const GitHubIntegration = ({ close, value }) => {
} else {
setIsIntagrated(false);
}
data?.integration?.keys?.connected_repos?.forEach((repo) => {
repo?.in_progress && setInProgressFlag(true);
});
setInProgressFlag(data?.integration?.keys?.connected_repos?.some((repo) => repo?.in_progress));
updateKeysState('connected_repos', data?.integration?.keys?.connected_repos || []);
setRepos(data?.repos);
setApplicationName(data?.application_name);
Expand Down Expand Up @@ -296,9 +294,14 @@ const GitHubIntegration = ({ close, value }) => {
removeRepo={(i) => {
removeRepoItem(i);
}}
type={index === formFields?.keys?.connected_repos?.length - 1 && addNew}
updateIntegration={updateIntegration}
addIsLoading={loadingSubmit || repo?.in_progress}
inProgressFlag={inProgressFlag}
disabled={
(addNew && index !== formFields?.keys?.connected_repos?.length - 1) || !addNew || repo?.in_progress
}
isEdittingIntegration={addNew}
isNew={index === formFields?.keys?.connected_repos?.length - 1 && addNew}
/>
);
})}
Expand Down
25 changes: 6 additions & 19 deletions ui_src/src/domain/administration/integrations/components/gitHubIntegration/integratedItem.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -20,9 +20,8 @@ import SelectComponent from '../../../../../components/select';
import Button from '../../../../../components/button';
import { FiPlus } from 'react-icons/fi';

const IntegrationItem = ({ index, repo, reposList, updateIntegrationList, removeRepo, type, updateIntegration, addIsLoading }) => {
const IntegrationItem = ({ isNew, index, disabled, repo, reposList, updateIntegrationList, removeRepo, updateIntegration, addIsLoading, isEdittingIntegration }) => {
const [isEditting, setIsEditting] = useState(false);
const [isRemoveLoading, setIsRemoveLoading] = useState(false);
const [formFields, setFormFields] = useState({
type: 'functions',
repo_name: '',
Expand Down Expand Up @@ -66,17 +65,6 @@ const IntegrationItem = ({ index, repo, reposList, updateIntegrationList, remove
} catch (error) {}
};

const handleRemoveRepo = async () => {
setIsRemoveLoading(true);
try {
removeRepo(index);
updateIntegration();
} catch (error) {
} finally {
setIsRemoveLoading(false);
}
};

return (
<div>
<div className="repos-item" repo={repo}>
Expand All @@ -91,7 +79,7 @@ const IntegrationItem = ({ index, repo, reposList, updateIntegrationList, remove
width={'90%'}
popupClassName="select-options"
value={formFields?.repo_name}
disabled={!type}
disabled={disabled}
onChange={(e) => {
updateRepo(e);
}}
Expand All @@ -110,14 +98,14 @@ const IntegrationItem = ({ index, repo, reposList, updateIntegrationList, remove
value={formFields?.branch}
options={branches || []}
popupClassName="select-options"
disabled={!type}
disabled={!isNew}
onChange={(e) => {
updateBranch(e);
}}
/>
</Form.Item>

{!type ? (
{!isNew ? (
<Button
height={'30px'}
width={'95px'}
Expand All @@ -131,9 +119,8 @@ const IntegrationItem = ({ index, repo, reposList, updateIntegrationList, remove
backgroundColorType={'white'}
radiusType={'circle'}
fontFamily="InterSemiBold"
onClick={handleRemoveRepo}
isLoading={isRemoveLoading}
disabled={!isRemoveLoading && addIsLoading}
onClick={() => removeRepo(index)}
disabled={isEdittingIntegration}
fontSize={'14px'}
border={'red'}
/>
Expand Down
2 changes: 1 addition & 1 deletion ui_src/src/domain/functions/components/functionBox/style.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@
border: 1px solid #e9e9e9;
border-radius: 8px;
width: 100%;
min-width: 480px;
min-width: 1050px;
box-shadow: 0px 6px 18px 0px #0000000f;
min-height: 106px;
max-height: 140px;
Expand Down
2 changes: 1 addition & 1 deletion ui_src/src/domain/functions/components/functionDetails/index.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -181,7 +181,7 @@ function FunctionDetails({ selectedFunction, installed, handleInstall, handleUnI
{onBackToFunction && (
<div className="back-to-function" onClick={onBackToFunction}>
<ArrowBackIcon />
<span>Back to Function</span>
<span>Back to function</span>
</div>
)}

Expand Down
90 changes: 56 additions & 34 deletions ui_src/src/domain/functions/components/functionList/index.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,8 +12,9 @@

import './style.scss';

import React, { useEffect, useState } from 'react';
import React, { useEffect, useState, useContext } from 'react';
import { Spin } from 'antd';
import { Context } from '../../../../hooks/store';
import { SyncOutlined } from '@ant-design/icons';
import GitHubIntegration from '../../../administration/integrations/components/gitHubIntegration';
import { ReactComponent as PlaceholderFunctionsIcon } from '../../../../assets/images/placeholderFunctions.svg';
Expand Down Expand Up @@ -50,6 +51,7 @@ import { getFunctionsTabs } from '../../../../services/valueConvertor';
const { Panel } = Collapse;

function FunctionList({ tabPrivate }) {
const [state, dispatch] = useContext(Context);
const [isLoading, setisLoading] = useState(true);
const [modalIsOpen, modalFlip] = useState(false);
const [cloneTooltipIsOpen, cloneTooltipIsOpenFlip] = useState(false);
Expand All @@ -66,49 +68,36 @@ function FunctionList({ tabPrivate }) {
const [clickedRefresh, setClickedRefresh] = useState(false);
const [refreshIndeicator, setRefreshIndicator] = useState(false);
const [isCloudModalOpen, setIsCloudModalOpen] = useState(false);
const ExpandIcon = ({ isActive }) => <img className={isActive ? 'collapse-arrow open' : 'collapse-arrow close'} src={CollapseArrow} alt="collapse-arrow" />;
const [githubIntegrationData, setGithubIntegrationData] = useState({});

const ExpandIcon = ({ isActive }) => <img className={isActive ? 'collapse-arrow open' : 'collapse-arrow close'} src={CollapseArrow} alt="collapse-arrow" />;
const TABS = getFunctionsTabs();

const content = (
<div className="git-repos-list">
{connectedRepos?.map((repo, index) => (
<div key={index}>
<div className="git-repos-item">
<div className="left-section">
{repo?.owner === OWNER ? <MemphisLogo alt="repo" className="repo-item-icon-memphis" /> : <RepoIcon alt="repo" className="repo-item-icon" />}
useEffect(() => {
findAndUpdateGithubIntegration();
}, [state?.integrationsList]);

<span className="repo-data">
<OverflowTip text={repo?.repo_name} center={false}>
{repo?.repo_name}
</OverflowTip>
<OverflowTip text={`${repo?.branch} | ${parsingDate(repo?.last_modified, false, false)}`} width={'170px'} center={false}>
<label className="last-modified">
{repo?.branch} | Last synced on {parsingDate(repo?.last_modified, false, false)}
</label>
</OverflowTip>
</span>
{repo?.in_progress ? (
<div className="refresh">
<Spin indicator={<SyncOutlined style={{ color: '#6557FF', fontSize: '16px' }} spin />} />
</div>
) : (
<MdDone alt="Healty" />
)}
</div>
</div>
<Divider />
</div>
))}
</div>
);
const findAndUpdateGithubIntegration = () => {
const integrationData = state?.integrationsList?.find((integration) => integration?.name === 'github');
setGithubIntegrationData(integrationData);
};

const getAllIntegrations = async () => {
try {
const data = await httpRequest('GET', ApiEndpoints.GET_ALL_INTEGRATION);
dispatch({ type: 'SET_INTEGRATIONS', payload: data || [] });
} catch (err) {
return;
}
};

useEffect(() => {
getAllFunctions();
if (localStorage.getItem(LOCAL_STORAGE_FUNCTION_PAGE_VIEW) !== 'true' && isCloud()) {
setIsFunctionsGuideOpen(true);
localStorage.setItem(LOCAL_STORAGE_FUNCTION_PAGE_VIEW, true);
}
getAllIntegrations();
}, []);

const getAllFunctions = async () => {
Expand Down Expand Up @@ -218,6 +207,39 @@ function FunctionList({ tabPrivate }) {
});
};

const content = (
<div className="git-repos-list">
{connectedRepos?.map((repo, index) => (
<div key={index}>
<div className="git-repos-item">
<div className="left-section">
{repo?.owner === OWNER ? <MemphisLogo alt="repo" className="repo-item-icon-memphis" /> : <RepoIcon alt="repo" className="repo-item-icon" />}

<span className="repo-data">
<OverflowTip text={repo?.repo_name} width={'170px'} center={false}>
{repo?.repo_name}
</OverflowTip>
<OverflowTip text={`${repo?.branch} | ${parsingDate(repo?.last_modified, false, false)}`} width={'170px'} center={false}>
<label className="last-modified">
{repo?.branch} | Synced on {parsingDate(repo?.last_modified, false, false)}
</label>
</OverflowTip>
</span>
{repo?.in_progress ? (
<div className="refresh">
<Spin indicator={<SyncOutlined style={{ color: '#6557FF', fontSize: '16px' }} spin />} />
</div>
) : (
<MdDone alt="Healty" />
)}
</div>
</div>
<Divider />
</div>
))}
</div>
);

const renderNoFunctionsFound = () => (
<div className="no-function-to-display">
<PlaceholderFunctionsIcon width={150} alt="placeholderFunctions" />
Expand Down Expand Up @@ -419,7 +441,7 @@ function FunctionList({ tabPrivate }) {
modalFlip(false);
}
}}
value={{}}
value={githubIntegrationData}
/>
</Modal>
<Modal
Expand Down
4 changes: 2 additions & 2 deletions ui_src/src/domain/functions/components/functionList/style.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@
}
connectedRepos {
display: flex;
width: 260px;
width: 270px;
height: 34px;
padding: 5px 10px;
justify-content: center;
Expand Down Expand Up @@ -166,7 +166,7 @@
}
.repos-popover {
margin-top: 10px;
width: 260px;
width: 270px;
}
.repo-data {
display: flex;
Expand Down
Loading

0 comments on commit 935f2de

Please sign in to comment.