## Description This is a refactor PR that helps introducing the packages section in EE. Apart from refactor there are some design changes that are made (refer figma design and the `Design changes` list). Refactor list - - Applications list extracted from the index file to it's own component (`ApplicationCardList.tsx`) - Extracted `+ New` button to a new component to override in EE (`WorkspaceAction.tsx`). - Created and moved workspace context menu just de-clutter the main Application page (`WorkspaceMenu.tsx`) - Mixed packages into the fuzzy search logic with dummy package selector logic (EE will have the main logic) - Extracted common Card logic from ApplicationCard component to reuse for packages. (`Card.tsx`) - Design changes - - Search bar increased width to `500px` - Workspace heading font size decreased to 16px - Workspace heading text color - Application card name font size decreased to 16px - Gap between application cards decreased to 12px - Added a horizontal divider between each workspace [Figma Design](https://www.figma.com/file/Z0QsSdGOydURn6WIMQ3rHM/Solution-Design?type=design&node-id=1171-91563&mode=design&t=GTnV1fZa5ODy8xGD-0) Fixes #26497 #### Type of change - Chore (housekeeping or task changes that don't impact user perception) ## Testing > #### How Has This Been Tested? > Please describe the tests that you ran to verify your changes. Also list any relevant details for your test configuration. > Delete anything that is not relevant - [x] Manual - [ ] JUnit - [x] Jest - [ ] Cypress > > #### Test Plan > Add Testsmith test cases links that relate to this PR > > #### Issues raised during DP testing > Link issues raised during DP testing for better visiblity and tracking (copy link from comments dropped on this PR) > > > ## Checklist: #### Dev activity - [x] My code follows the style guidelines of this project - [x] I have performed a self-review of my own code - [x] I have commented my code, particularly in hard-to-understand areas - [ ] I have made corresponding changes to the documentation - [x] My changes generate no new warnings - [ ] I have added tests that prove my fix is effective or that my feature works - [x] New and existing unit tests pass locally with my changes - [ ] PR is being merged under a feature flag #### QA activity: - [ ] [Speedbreak features](https://github.com/appsmithorg/TestSmith/wiki/Guidelines-for-test-plans#speedbreakers-) have been covered - [ ] Test plan covers all impacted features and [areas of interest](https://github.com/appsmithorg/TestSmith/wiki/Guidelines-for-test-plans#areas-of-interest-) - [ ] Test plan has been peer reviewed by project stakeholders and other QA members - [ ] Manually tested functionality on DP - [ ] We had an implementation alignment call with stakeholders post QA Round 2 - [ ] Cypress test cases have been added and approved by SDET/manual QA - [ ] Added `Test Plan Approved` label after Cypress tests were reviewed - [ ] Added `Test Plan Approved` label after JUnit tests were reviewed --------- Co-authored-by: Ankita Kinger <ankita@appsmith.com>
32 lines
761 B
TypeScript
32 lines
761 B
TypeScript
import React from "react";
|
|
import styled from "styled-components";
|
|
import { Icon, Tooltip } from "design-system";
|
|
|
|
import { CONNECTED_TO_GIT, createMessage } from "@appsmith/constants/messages";
|
|
|
|
const StyledGitConnectedBadge = styled.div`
|
|
width: 24px;
|
|
height: 24px;
|
|
border-radius: 50%;
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
position: absolute;
|
|
top: -12px;
|
|
right: -12px;
|
|
box-shadow: 0px 2px 16px rgba(0, 0, 0, 0.07);
|
|
background: var(--ads-v2-color-bg);
|
|
`;
|
|
|
|
function GitConnectedBadge() {
|
|
return (
|
|
<StyledGitConnectedBadge>
|
|
<Tooltip content={createMessage(CONNECTED_TO_GIT)}>
|
|
<Icon name="fork" size="md" />
|
|
</Tooltip>
|
|
</StyledGitConnectedBadge>
|
|
);
|
|
}
|
|
|
|
export default GitConnectedBadge;
|