admin/twenty
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

feat: check if company/person saved (chrome-extension) (#4280)

Browse Source 
* add twenty icon

* rest api calls for company

* check if company exists

* refacto

* person/company saved call

* gql codegen init

* type defs

* build fix

* DB calls with gql codegen and apollo integration
This commit is contained in:
Aditya Pimpalkar
2024-03-26 13:37:36 +00:00
committed by GitHub
parent c54acb35b6
commit 5c5dcf5cb5
20 changed files with 6107 additions and 241 deletions
Download Patch File Download Diff File Expand all files Collapse all files

64
packages/twenty-chrome-extension/src/contentScript/createButton.ts
View File

@ -1,42 +1,55 @@
/* eslint-disable @nx/workspace-no-hardcoded-colors */
const createNewButton = (
text: string,
onClickHandler: () => void,
): HTMLButtonElement => {
const newButton: HTMLButtonElement = document.createElement('button');
newButton.textContent = text;
): HTMLDivElement => {
const div = document.createElement('div');
const img = document.createElement('img');
const span = document.createElement('span');
span.textContent = text;
img.src =
'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAACXBIWXMAAA7EAAAOxAGVKw4bAAACb0lEQVR4nO2VO4taQRTHr3AblbjxEVlwCwVhg7BoqqCIjy/gAyyFWNlYBOxsfH0KuxgQGwXRUkGuL2S7i1barGAgiwbdW93SnGOc4BonPiKahf3DwXFmuP/fPM4ZlvmlTxAhCBdzHnEQWYiv7Mr4C3NeuVYhQYDPzOUUQgDLBQGcLHNhvQK8DACPx8PTxiqVyvISG43GbyaT6Qfpn06n0m63e/tPAPF4vJ1MJu8kEsnWTCkWi1yr1RKGw+GDRqPBOTfr44vFQvD7/Q/lcpmaaVQAr9fLp1IpO22c47hGOBz+MB6PH+Vy+VYDAL8qlUoGtVotzOfzq4MAgsHgE/6KojiQyWR/bKVSqbSszHFM8Pl8z1YK48JsNltCOBwOnrYLO+8AAIjb+nHbycoTiUQfDJ7tFq4YAHiVSmXBxcD41u8flQU8z7fhzO0r83atVns3Go3u9Xr9x0O/RQXo9/tsIBBg6vX606a52Wz+bZ7P5/WwG29gxSJzhKgA6XTaDoFNF+krFAocmC//4yWEcSf2wTm7mCO19xFgSsKOLI16vV7b7XY7mRNoLwA0JymJ5uQIzgIAuX5PzDElT2m+E8BqtQ4ymcx7Yq7T6a6ZE4sKgOadTucaCwkxp1UzlEKh0GDxIXOwDWHAdi6Xe3swQDQa/Q7mywoolUpvsaptymazDWKxmBHTlWXZm405BFZoNpuGgwEmk4mE2SGtVivii4f1AO7J3ZopkQCQj7Ar1FeRChCJRJzVapX6DKNIfSc1Ax+wtQWQ55h6bH8FWDfYV4fO3wlwDr0C/BcADYiTPCxHqIEA2QsCZAkAKnRGkMbKN/sTX5YHPQ1e7SkAAAAASUVORK5CYII=';
img.height = 16;
img.width = 16;
img.alt = 'Twenty logo';
// Write universal styles for the button
const buttonStyles = {
const divStyles = {
border: '1px solid black',
borderRadius: '20px',
backgroundColor: 'black',
color: 'white',
fontSize: '1.5rem',
fontWeight: '600',
padding: '0.45em 1em',
width: '15rem',
fontSize: '1.5rem',
display: 'flex',
alignItems: 'center',
gap: '5px',
justifyContent: 'center',
padding: '0 1rem',
cursor: 'pointer',
height: '32px',
};
// Apply common styles to the button.
Object.assign(newButton.style, buttonStyles);
Object.assign(div.style, divStyles);
// Apply common styles to specifc states of a button.
newButton.addEventListener('mouseenter', () => {
const hoverStyles = {
backgroundColor: '#5e5e5e',
borderColor: '#5e5e5e',
};
Object.assign(newButton.style, hoverStyles);
});
// // Apply common styles to the button.
// Object.assign(buttonDiv.style, buttonDivStyles);
newButton.addEventListener('mouseleave', () => {
Object.assign(newButton.style, buttonStyles);
});
// // Apply common styles to specifc states of a button.
// newButton.addEventListener('mouseenter', () => {
// const hoverStyles = {
// backgroundColor: '#5e5e5e',
// borderColor: '#5e5e5e',
// };
// Object.assign(newButton.style, hoverStyles);
// });
// newButton.addEventListener('mouseleave', () => {
// Object.assign(newButton.style, buttonStyles);
// });
// Handle the click event.
newButton.addEventListener('click', async () => {
div.addEventListener('click', async () => {
const { apiKey } = await chrome.storage.local.get('apiKey');
// If an api key is not set, the options page opens up to allow the user to configure an api key.
@ -46,13 +59,16 @@ const createNewButton = (
}
// Update content during the resolution of the request.
newButton.textContent = 'Saving...';
span.textContent = 'Saving...';
// Call the provided onClickHandler function to handle button click logic
onClickHandler();
});
return newButton;
div.appendChild(img);
div.appendChild(span);
return div;
};
export default createNewButton;