jan/openreplay
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Fix integrations icons (#2149)

Browse source 
* fix ui: fix icons for integrations

* fix ui: fix note integrations count fetcher
This commit is contained in:
Delirium 2024-04-29 16:10:18 +02:00 • committed by GitHub
parent 24d15db93b
commit 8578180d5f
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
18 changed files with 26 additions and 25 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
frontend/app/assets/integrations/slack-bw.svg
View file

@ -1,3 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" class="bi bi-slack" viewBox="0 0 16 16">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">
<path d="M3.362 10.11c0 .926-.756 1.681-1.681 1.681S0 11.036 0 10.111C0 9.186.756 8.43 1.68 8.43h1.682v1.68zm.846 0c0-.924.756-1.68 1.681-1.68s1.681.756 1.681 1.68v4.21c0 .924-.756 1.68-1.68 1.68a1.685 1.685 0 0 1-1.682-1.68v-4.21zM5.89 3.362c-.926 0-1.682-.756-1.682-1.681S4.964 0 5.89 0s1.68.756 1.68 1.68v1.682H5.89zm0 .846c.924 0 1.68.756 1.68 1.681S6.814 7.57 5.89 7.57H1.68C.757 7.57 0 6.814 0 5.89c0-.926.756-1.682 1.68-1.682h4.21zm6.749 1.682c0-.926.755-1.682 1.68-1.682.925 0 1.681.756 1.681 1.681s-.756 1.681-1.68 1.681h-1.681V5.89zm-.848 0c0 .924-.755 1.68-1.68 1.68A1.685 1.685 0 0 1 8.43 5.89V1.68C8.43.757 9.186 0 10.11 0c.926 0 1.681.756 1.681 1.68v4.21zm-1.681 6.748c.926 0 1.682.756 1.682 1.681S11.036 16 10.11 16s-1.681-.756-1.681-1.68v-1.682h1.68zm0-.847c-.924 0-1.68-.755-1.68-1.68 0-.925.756-1.681 1.68-1.681h4.21c.924 0 1.68.756 1.68 1.68 0 .926-.756 1.681-1.68 1.681h-4.21z"/>
</svg>

Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 990 B

After

Width:  |  Height:  |  Size: 970 B

6
frontend/app/components/Session_/Player/Controls/components/CreateNote.tsx
View file

@ -65,10 +65,8 @@ function CreateNote({
React.useEffect(() => {
if (inputRef.current) {
inputRef.current.focus();
if (teamsChannels.size === 0 || slackChannels.size === 0) {
fetchSlack();
fetchTeams();
}
fetchSlack();
fetchTeams();
}
}, []);

4
frontend/app/components/shared/Bookmark/Bookmark.tsx
View file

@ -3,7 +3,7 @@ import { toggleFavorite } from 'Duck/sessions';
import { connect } from 'react-redux';
import { toast } from 'react-toastify';
import { Button, Popover } from 'antd'
import { SaveOutlined } from '@ant-design/icons';
import { Vault } from 'lucide-react'
interface Props {
toggleFavorite: (sessionId: string) => Promise<void>;
@ -37,7 +37,7 @@ function Bookmark(props: Props) {
<div onClick={toggleFavorite} className="w-full">
<Popover content={isFavorite ? TOOLTIP_TEXT_REMOVE : TOOLTIP_TEXT_ADD}>
<Button type={isFavorite ? 'primary' : undefined} ghost={isFavorite} size={'small'} className={'flex items-center justify-center'}>
<SaveOutlined />
<Vault size={16} strokeWidth={1} />
</Button>
</Popover>
</div>

3
frontend/app/components/shared/SharePopup/SharePopup.tsx
View file

@ -199,13 +199,14 @@ function ShareModalComp({
onChange={(value) => setShareTo(value as 'slack' | 'teams')}
/>
) : (
<div>
<div className={'flex items-center gap-2'}>
<Icon
name={
slackOptions.length > 0
? 'integrations/slack-bw'
: 'integrations/teams-white'
}
size={16}
/>
<div>{slackOptions.length > 0 ? 'Slack' : 'MS Teams'}</div>
</div>

2
frontend/app/components/ui/Icons/credit_card_2_back.tsx
View file

@ -12,7 +12,7 @@ interface Props {
function Credit_card_2_back(props: Props) {
const { size = 14, width = size, height = size, fill = '' } = props;
return (
<svg fill="currentColor" width={ `${ width }px` } height={ `${ height }px` } ><path d="M11 5.5a.5.5 0 0 1 .5-.5h2a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-2a.5.5 0 0 1-.5-.5v-1z"/><path d="M2 2a2 2 0 0 0-2 2v8a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V4a2 2 0 0 0-2-2H2zm13 2v5H1V4a1 1 0 0 1 1-1h12a1 1 0 0 1 1 1zm-1 9H2a1 1 0 0 1-1-1v-1h14v1a1 1 0 0 1-1 1z"/></svg>
<svg fill="currentColor" viewBox="0 0 16 16" width={ `${ width }px` } height={ `${ height }px` } ><path d="M11 5.5a.5.5 0 0 1 .5-.5h2a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-2a.5.5 0 0 1-.5-.5v-1z"/><path d="M2 2a2 2 0 0 0-2 2v8a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V4a2 2 0 0 0-2-2H2zm13 2v5H1V4a1 1 0 0 1 1-1h12a1 1 0 0 1 1 1zm-1 9H2a1 1 0 0 1-1-1v-1h14v1a1 1 0 0 1-1 1z"/></svg>
);
}

2
frontend/app/components/ui/Icons/envelope_paper.tsx
View file

@ -12,7 +12,7 @@ interface Props {
function Envelope_paper(props: Props) {
const { size = 14, width = size, height = size, fill = '' } = props;
return (
<svg fill="currentColor" width={ `${ width }px` } height={ `${ height }px` } ><path d="M4 0a2 2 0 0 0-2 2v1.133l-.941.502A2 2 0 0 0 0 5.4V14a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V5.4a2 2 0 0 0-1.059-1.765L14 3.133V2a2 2 0 0 0-2-2H4Zm10 4.267.47.25A1 1 0 0 1 15 5.4v.817l-1 .6v-2.55Zm-1 3.15-3.75 2.25L8 8.917l-1.25.75L3 7.417V2a1 1 0 0 1 1-1h8a1 1 0 0 1 1 1v5.417Zm-11-.6-1-.6V5.4a1 1 0 0 1 .53-.882L2 4.267v2.55Zm13 .566v5.734l-4.778-2.867L15 7.383Zm-.035 6.88A1 1 0 0 1 14 15H2a1 1 0 0 1-.965-.738L8 10.083l6.965 4.18ZM1 13.116V7.383l4.778 2.867L1 13.117Z"/></svg>
<svg fill="currentColor" viewBox="0 0 16 16" width={ `${ width }px` } height={ `${ height }px` } ><path d="M4 0a2 2 0 0 0-2 2v1.133l-.941.502A2 2 0 0 0 0 5.4V14a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V5.4a2 2 0 0 0-1.059-1.765L14 3.133V2a2 2 0 0 0-2-2H4Zm10 4.267.47.25A1 1 0 0 1 15 5.4v.817l-1 .6v-2.55Zm-1 3.15-3.75 2.25L8 8.917l-1.25.75L3 7.417V2a1 1 0 0 1 1-1h8a1 1 0 0 1 1 1v5.417Zm-11-.6-1-.6V5.4a1 1 0 0 1 .53-.882L2 4.267v2.55Zm13 .566v5.734l-4.778-2.867L15 7.383Zm-.035 6.88A1 1 0 0 1 14 15H2a1 1 0 0 1-.965-.738L8 10.083l6.965 4.18ZM1 13.116V7.383l4.778 2.867L1 13.117Z"/></svg>
);
}

2
frontend/app/components/ui/Icons/funnel_fill.tsx
View file

@ -12,7 +12,7 @@ interface Props {
function Funnel_fill(props: Props) {
const { size = 14, width = size, height = size, fill = '' } = props;
return (
<svg width={ `${ width }px` } height={ `${ height }px` } ><path d="M1.5 1.5A.5.5 0 0 1 2 1h12a.5.5 0 0 1 .5.5v2a.5.5 0 0 1-.128.334L10 8.692V13.5a.5.5 0 0 1-.342.474l-3 1A.5.5 0 0 1 6 14.5V8.692L1.628 3.834A.5.5 0 0 1 1.5 3.5v-2z"/></svg>
<svg viewBox="0 0 16 16" width={ `${ width }px` } height={ `${ height }px` } ><path d="M1.5 1.5A.5.5 0 0 1 2 1h12a.5.5 0 0 1 .5.5v2a.5.5 0 0 1-.128.334L10 8.692V13.5a.5.5 0 0 1-.342.474l-3 1A.5.5 0 0 1 6 14.5V8.692L1.628 3.834A.5.5 0 0 1 1.5 3.5v-2z"/></svg>
);
}

2
frontend/app/components/ui/Icons/integrations_bugsnag.tsx
View file

@ -12,7 +12,7 @@ interface Props {
function Integrations_bugsnag(props: Props) {
const { size = 14, width = size, height = size, fill = '' } = props;
return (
<svg fill="none" width={ `${ width }px` } height={ `${ height }px` } fill={ `${ fill }` }><path d="M28.943 55.123a3.228 3.228 0 1 0 0-6.455 3.228 3.228 0 0 0 0 6.456Z" fill="#303F9F"/><path d="M28.943 78.961A27.096 27.096 0 0 1 1.878 51.896V38.474A2.015 2.015 0 0 1 3.89 36.46h9.6l-.032-31.072-7.555 4.649v17.693a2.013 2.013 0 1 1-4.025 0V9.806A3.634 3.634 0 0 1 3.6 6.725l8.368-5.15a3.618 3.618 0 0 1 5.514 3.081l.035 31.803h11.425A15.436 15.436 0 1 1 13.51 51.896l-.014-11.409H5.903v11.409a23.04 23.04 0 1 0 23.04-23.04h-3.492a2.013 2.013 0 0 1 0-4.026h3.492a27.065 27.065 0 1 1 0 54.131Zm-11.42-38.474v11.406a11.41 11.41 0 1 0 11.409-11.406h-11.41Z" fill="#303F9F"/></svg>
<svg viewBox="0 0 58 80" fill="none" width={ `${ width }px` } height={ `${ height }px` } fill={ `${ fill }` }><path d="M28.943 55.123a3.228 3.228 0 1 0 0-6.455 3.228 3.228 0 0 0 0 6.456Z" fill="#303F9F"/><path d="M28.943 78.961A27.096 27.096 0 0 1 1.878 51.896V38.474A2.015 2.015 0 0 1 3.89 36.46h9.6l-.032-31.072-7.555 4.649v17.693a2.013 2.013 0 1 1-4.025 0V9.806A3.634 3.634 0 0 1 3.6 6.725l8.368-5.15a3.618 3.618 0 0 1 5.514 3.081l.035 31.803h11.425A15.436 15.436 0 1 1 13.51 51.896l-.014-11.409H5.903v11.409a23.04 23.04 0 1 0 23.04-23.04h-3.492a2.013 2.013 0 0 1 0-4.026h3.492a27.065 27.065 0 1 1 0 54.131Zm-11.42-38.474v11.406a11.41 11.41 0 1 0 11.409-11.406h-11.41Z" fill="#303F9F"/></svg>
);
}

2
frontend/app/components/ui/Icons/integrations_newrelic.tsx
View file

@ -12,7 +12,7 @@ interface Props {
function Integrations_newrelic(props: Props) {
const { size = 14, width = size, height = size, fill = '' } = props;
return (
<svg fill="none" width={ `${ width }px` } height={ `${ height }px` } fill={ `${ fill }` }><g><path d="M57.048 28.04v24.921l-21.73 12.463V81L70.64 60.752V20.25l-13.592 7.79Z" fill="#00AC69"/><path d="m35.322 15.581 21.73 12.458 13.591-7.79L35.321 0 0 20.248l13.587 7.791 21.735-12.458Z" fill="#1CE783"/><path d="M21.735 48.294v24.92L35.322 81V40.503L0 20.25v15.58l21.735 12.464Z" fill="#000" fillOpacity=".87"/></g><defs><clipPath id="a"><path fill="#fff" d="M0 0h70.874v81H0z"/></clipPath></defs></svg>
<svg viewBox="0 0 71 81" fill="none" width={ `${ width }px` } height={ `${ height }px` } fill={ `${ fill }` }><g><path d="M57.048 28.04v24.921l-21.73 12.463V81L70.64 60.752V20.25l-13.592 7.79Z" fill="#00AC69"/><path d="m35.322 15.581 21.73 12.458 13.591-7.79L35.321 0 0 20.248l13.587 7.791 21.735-12.458Z" fill="#1CE783"/><path d="M21.735 48.294v24.92L35.322 81V40.503L0 20.25v15.58l21.735 12.464Z" fill="#000" fillOpacity=".87"/></g><defs><clipPath id="a"><path fill="#fff" d="M0 0h70.874v81H0z"/></clipPath></defs></svg>
);
}

2
frontend/app/components/ui/Icons/integrations_rollbar.tsx
View file

@ -12,7 +12,7 @@ interface Props {
function Integrations_rollbar(props: Props) {
const { size = 14, width = size, height = size, fill = '' } = props;
return (
<svg fill="none" width={ `${ width }px` } height={ `${ height }px` } fill={ `${ fill }` }><g><path clipRule="evenodd" d="M84.94 2.095a2.231 2.231 0 0 0-.041-.404c0-.04-.02-.077-.033-.118-.012-.04-.052-.182-.085-.27l-.06-.13a1.767 1.767 0 0 0-.13-.222c-.028-.045-.056-.09-.088-.134L84.446.74c-.032-.036-.069-.064-.101-.097l-.081-.097-.065-.044a2.032 2.032 0 0 0-.186-.142l-.157-.1a2.042 2.042 0 0 0-.215-.098l-.17-.068c-.076-.025-.157-.037-.234-.053l-.174-.036a2.258 2.258 0 0 0-.287 0h-.162c-1.083.097-15.4 1.463-31.492 8.64-9.663 4.298-17.143 10.896-21.85 18.906l-1.212.526C10.83 35.767.537 50.714.537 68.064v.29a2.099 2.099 0 0 0 2.099 2.095h57.19c.112 0 .223-.009.332-.028l.146-.036c.069-.02.138-.033.206-.057.069-.024.101-.049.154-.073.052-.024.121-.048.178-.08.107-.064.208-.135.303-.215L84.191 50.53a2.085 2.085 0 0 0 .744-1.618V2.095h.004ZM64.1 61.979l-2.211 1.864V22.5L80.747 6.607V47.95L64.1 61.979ZM26.45 51.018h31.246v15.239H8.369l18.081-15.24Zm26.374-38.54a108.046 108.046 0 0 1 22.97-7.185L58.938 19.505c-7.781.95-15.434 2.751-22.82 5.373 4.172-5.094 9.8-9.32 16.706-12.4ZM32.111 30.907a108.216 108.216 0 0 1 25.585-7.015v22.933H27.825a37.058 37.058 0 0 1 4.286-15.918Zm-5.754 2.677a41.523 41.523 0 0 0-2.773 14.357l-18.6 15.695c1.408-12.752 8.98-23.418 21.373-30.053Z" fill="#3569F3"/></g><defs><clipPath id="a"><path fill="#fff" transform="translate(.537)" d="M0 0h86.778v71H0z"/></clipPath></defs></svg>
<svg viewBox="0 0 88 71" fill="none" width={ `${ width }px` } height={ `${ height }px` } fill={ `${ fill }` }><g><path clipRule="evenodd" d="M84.94 2.095a2.231 2.231 0 0 0-.041-.404c0-.04-.02-.077-.033-.118-.012-.04-.052-.182-.085-.27l-.06-.13a1.767 1.767 0 0 0-.13-.222c-.028-.045-.056-.09-.088-.134L84.446.74c-.032-.036-.069-.064-.101-.097l-.081-.097-.065-.044a2.032 2.032 0 0 0-.186-.142l-.157-.1a2.042 2.042 0 0 0-.215-.098l-.17-.068c-.076-.025-.157-.037-.234-.053l-.174-.036a2.258 2.258 0 0 0-.287 0h-.162c-1.083.097-15.4 1.463-31.492 8.64-9.663 4.298-17.143 10.896-21.85 18.906l-1.212.526C10.83 35.767.537 50.714.537 68.064v.29a2.099 2.099 0 0 0 2.099 2.095h57.19c.112 0 .223-.009.332-.028l.146-.036c.069-.02.138-.033.206-.057.069-.024.101-.049.154-.073.052-.024.121-.048.178-.08.107-.064.208-.135.303-.215L84.191 50.53a2.085 2.085 0 0 0 .744-1.618V2.095h.004ZM64.1 61.979l-2.211 1.864V22.5L80.747 6.607V47.95L64.1 61.979ZM26.45 51.018h31.246v15.239H8.369l18.081-15.24Zm26.374-38.54a108.046 108.046 0 0 1 22.97-7.185L58.938 19.505c-7.781.95-15.434 2.751-22.82 5.373 4.172-5.094 9.8-9.32 16.706-12.4ZM32.111 30.907a108.216 108.216 0 0 1 25.585-7.015v22.933H27.825a37.058 37.058 0 0 1 4.286-15.918Zm-5.754 2.677a41.523 41.523 0 0 0-2.773 14.357l-18.6 15.695c1.408-12.752 8.98-23.418 21.373-30.053Z" fill="#3569F3"/></g><defs><clipPath id="a"><path fill="#fff" transform="translate(.537)" d="M0 0h86.778v71H0z"/></clipPath></defs></svg>
);
}

2
frontend/app/components/ui/Icons/integrations_slack_bw.tsx
View file

@ -12,7 +12,7 @@ interface Props {
function Integrations_slack_bw(props: Props) {
const { size = 14, width = size, height = size, fill = '' } = props;
return (
<svg width={ `${ width }px` } height={ `${ height }px` } fill={ `${ fill }` }><path d="M3.362 10.11c0 .926-.756 1.681-1.681 1.681S0 11.036 0 10.111C0 9.186.756 8.43 1.68 8.43h1.682v1.68zm.846 0c0-.924.756-1.68 1.681-1.68s1.681.756 1.681 1.68v4.21c0 .924-.756 1.68-1.68 1.68a1.685 1.685 0 0 1-1.682-1.68v-4.21zM5.89 3.362c-.926 0-1.682-.756-1.682-1.681S4.964 0 5.89 0s1.68.756 1.68 1.68v1.682H5.89zm0 .846c.924 0 1.68.756 1.68 1.681S6.814 7.57 5.89 7.57H1.68C.757 7.57 0 6.814 0 5.89c0-.926.756-1.682 1.68-1.682h4.21zm6.749 1.682c0-.926.755-1.682 1.68-1.682.925 0 1.681.756 1.681 1.681s-.756 1.681-1.68 1.681h-1.681V5.89zm-.848 0c0 .924-.755 1.68-1.68 1.68A1.685 1.685 0 0 1 8.43 5.89V1.68C8.43.757 9.186 0 10.11 0c.926 0 1.681.756 1.681 1.68v4.21zm-1.681 6.748c.926 0 1.682.756 1.682 1.681S11.036 16 10.11 16s-1.681-.756-1.681-1.68v-1.682h1.68zm0-.847c-.924 0-1.68-.755-1.68-1.68 0-.925.756-1.681 1.68-1.681h4.21c.924 0 1.68.756 1.68 1.68 0 .926-.756 1.681-1.68 1.681h-4.21z"/></svg>
<svg viewBox="0 0 16 16" width={ `${ width }px` } height={ `${ height }px` } fill={ `${ fill }` }><path d="M3.362 10.11c0 .926-.756 1.681-1.681 1.681S0 11.036 0 10.111C0 9.186.756 8.43 1.68 8.43h1.682v1.68zm.846 0c0-.924.756-1.68 1.681-1.68s1.681.756 1.681 1.68v4.21c0 .924-.756 1.68-1.68 1.68a1.685 1.685 0 0 1-1.682-1.68v-4.21zM5.89 3.362c-.926 0-1.682-.756-1.682-1.681S4.964 0 5.89 0s1.68.756 1.68 1.68v1.682H5.89zm0 .846c.924 0 1.68.756 1.68 1.681S6.814 7.57 5.89 7.57H1.68C.757 7.57 0 6.814 0 5.89c0-.926.756-1.682 1.68-1.682h4.21zm6.749 1.682c0-.926.755-1.682 1.68-1.682.925 0 1.681.756 1.681 1.681s-.756 1.681-1.68 1.681h-1.681V5.89zm-.848 0c0 .924-.755 1.68-1.68 1.68A1.685 1.685 0 0 1 8.43 5.89V1.68C8.43.757 9.186 0 10.11 0c.926 0 1.681.756 1.681 1.68v4.21zm-1.681 6.748c.926 0 1.682.756 1.682 1.681S11.036 16 10.11 16s-1.681-.756-1.681-1.68v-1.682h1.68zm0-.847c-.924 0-1.68-.755-1.68-1.68 0-.925.756-1.681 1.68-1.681h4.21c.924 0 1.68.756 1.68 1.68 0 .926-.756 1.681-1.68 1.681h-4.21z"/></svg>
);
}

2
frontend/app/components/ui/Icons/mouse_pointer_click.tsx
View file

@ -12,7 +12,7 @@ interface Props {
function Mouse_pointer_click(props: Props) {
const { size = 14, width = size, height = size, fill = '' } = props;
return (
<svg fill="none" width={ `${ width }px` } height={ `${ height }px` } ><g stroke="#000" strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round"><path d="m5.25 5.25 2.917 7L9.2 9.201l3.049-1.034-7-2.917Z" fill="#000" fillOpacity=".85"/><path d="m9.375 9.375 2.475 2.475M4.193 1.306l.453 1.69m-1.65 1.65-1.69-.453m6.832-1.83L6.9 3.6M3.6 6.9 2.363 8.137"/></g></svg>
<svg viewBox="0 0 14 14" fill="none" width={ `${ width }px` } height={ `${ height }px` } ><g stroke="#000" strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round"><path d="m5.25 5.25 2.917 7L9.2 9.201l3.049-1.034-7-2.917Z" fill="#000" fillOpacity=".85"/><path d="m9.375 9.375 2.475 2.475M4.193 1.306l.453 1.69m-1.65 1.65-1.69-.453m6.832-1.83L6.9 3.6M3.6 6.9 2.363 8.137"/></g></svg>
);
}

2
frontend/app/components/ui/Icons/user_switch.tsx
View file

@ -12,7 +12,7 @@ interface Props {
function User_switch(props: Props) {
const { size = 14, width = size, height = size, fill = '' } = props;
return (
<svg fill="none" width={ `${ width }px` } height={ `${ height }px` } ><path d="M11.526 4.23a3.874 3.874 0 1 0-6.14 3.144l-.015.007A5.822 5.822 0 0 0 3.507 8.64a5.835 5.835 0 0 0-1.256 1.867 5.838 5.838 0 0 0-.46 2.158.125.125 0 0 0 .126.128h.935a.126.126 0 0 0 .125-.122 4.662 4.662 0 0 1 1.37-3.192A4.631 4.631 0 0 1 7.65 8.106a3.874 3.874 0 0 0 3.875-3.875ZM7.65 6.919a2.687 2.687 0 1 1 0-5.375 2.687 2.687 0 0 1 0 5.375Zm1.64 3.453h4.125a.125.125 0 0 0 .125-.125v-.875a.125.125 0 0 0-.125-.125H10.66l.737-.939a.126.126 0 0 0 .027-.076.125.125 0 0 0-.125-.125h-1.135a.255.255 0 0 0-.196.095l-1.07 1.36a.501.501 0 0 0 .395.81Zm3.75 1H8.918a.125.125 0 0 0-.125.125v.875c0 .069.056.125.125.125h2.757l-.737.94a.125.125 0 0 0 .098.201h1.135a.255.255 0 0 0 .197-.096l1.07-1.36a.502.502 0 0 0-.396-.81Z" fill="#000" fillOpacity=".85"/></svg>
<svg viewBox="0 0 15 14" fill="none" width={ `${ width }px` } height={ `${ height }px` } ><path d="M11.526 4.23a3.874 3.874 0 1 0-6.14 3.144l-.015.007A5.822 5.822 0 0 0 3.507 8.64a5.835 5.835 0 0 0-1.256 1.867 5.838 5.838 0 0 0-.46 2.158.125.125 0 0 0 .126.128h.935a.126.126 0 0 0 .125-.122 4.662 4.662 0 0 1 1.37-3.192A4.631 4.631 0 0 1 7.65 8.106a3.874 3.874 0 0 0 3.875-3.875ZM7.65 6.919a2.687 2.687 0 1 1 0-5.375 2.687 2.687 0 0 1 0 5.375Zm1.64 3.453h4.125a.125.125 0 0 0 .125-.125v-.875a.125.125 0 0 0-.125-.125H10.66l.737-.939a.126.126 0 0 0 .027-.076.125.125 0 0 0-.125-.125h-1.135a.255.255 0 0 0-.196.095l-1.07 1.36a.501.501 0 0 0 .395.81Zm3.75 1H8.918a.125.125 0 0 0-.125.125v.875c0 .069.056.125.125.125h2.757l-.737.94a.125.125 0 0 0 .098.201h1.135a.255.255 0 0 0 .197-.096l1.07-1.36a.502.502 0 0 0-.396-.81Z" fill="#000" fillOpacity=".85"/></svg>
);
}

4
frontend/app/components/ui/SVG.tsx
View file

@ -1777,8 +1777,8 @@ const SVG = (props: Props) => {
case 'sparkles': return <Sparkles width={ width } height={ height } fill={ fill } />;
case 'speedometer2': return <Speedometer2 width={ width } height={ height } fill={ fill } />;

2
frontend/app/svg/icons/integrations/slack-bw.svg
View file

@ -1,3 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" class="bi bi-slack" viewBox="0 0 16 16">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16" >
<path d="M3.362 10.11c0 .926-.756 1.681-1.681 1.681S0 11.036 0 10.111C0 9.186.756 8.43 1.68 8.43h1.682v1.68zm.846 0c0-.924.756-1.68 1.681-1.68s1.681.756 1.681 1.68v4.21c0 .924-.756 1.68-1.68 1.68a1.685 1.685 0 0 1-1.682-1.68v-4.21zM5.89 3.362c-.926 0-1.682-.756-1.682-1.681S4.964 0 5.89 0s1.68.756 1.68 1.68v1.682H5.89zm0 .846c.924 0 1.68.756 1.68 1.681S6.814 7.57 5.89 7.57H1.68C.757 7.57 0 6.814 0 5.89c0-.926.756-1.682 1.68-1.682h4.21zm6.749 1.682c0-.926.755-1.682 1.68-1.682.925 0 1.681.756 1.681 1.681s-.756 1.681-1.68 1.681h-1.681V5.89zm-.848 0c0 .924-.755 1.68-1.68 1.68A1.685 1.685 0 0 1 8.43 5.89V1.68C8.43.757 9.186 0 10.11 0c.926 0 1.681.756 1.681 1.68v4.21zm-1.681 6.748c.926 0 1.682.756 1.682 1.681S11.036 16 10.11 16s-1.681-.756-1.681-1.68v-1.682h1.68zm0-.847c-.924 0-1.68-.755-1.68-1.68 0-.925.756-1.681 1.68-1.681h4.21c.924 0 1.68.756 1.68 1.68 0 .926-.756 1.681-1.68 1.681h-4.21z"/>
</svg>

Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1,013 B

After

Width:  |  Height:  |  Size: 994 B

2
frontend/app/svg/icons/slack.svg
View file

@ -1,3 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" class="bi bi-slack" viewBox="0 0 16 16">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">
<path d="M3.362 10.11c0 .926-.756 1.681-1.681 1.681S0 11.036 0 10.111C0 9.186.756 8.43 1.68 8.43h1.682v1.68zm.846 0c0-.924.756-1.68 1.681-1.68s1.681.756 1.681 1.68v4.21c0 .924-.756 1.68-1.68 1.68a1.685 1.685 0 0 1-1.682-1.68v-4.21zM5.89 3.362c-.926 0-1.682-.756-1.682-1.681S4.964 0 5.89 0s1.68.756 1.68 1.68v1.682H5.89zm0 .846c.924 0 1.68.756 1.68 1.681S6.814 7.57 5.89 7.57H1.68C.757 7.57 0 6.814 0 5.89c0-.926.756-1.682 1.68-1.682h4.21zm6.749 1.682c0-.926.755-1.682 1.68-1.682.925 0 1.681.756 1.681 1.681s-.756 1.681-1.68 1.681h-1.681V5.89zm-.848 0c0 .924-.755 1.68-1.68 1.68A1.685 1.685 0 0 1 8.43 5.89V1.68C8.43.757 9.186 0 10.11 0c.926 0 1.681.756 1.681 1.68v4.21zm-1.681 6.748c.926 0 1.682.756 1.682 1.681S11.036 16 10.11 16s-1.681-.756-1.681-1.68v-1.682h1.68zm0-.847c-.924 0-1.68-.755-1.68-1.68 0-.925.756-1.681 1.68-1.681h4.21c.924 0 1.68.756 1.68 1.68 0 .926-.756 1.681-1.68 1.681h-4.21z"/>
</svg>
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 989 B

After

Width:  |  Height:  |  Size: 969 B

2
frontend/app/svg/integrations/slack-bw.svg
View file

@ -1,3 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" class="bi bi-slack" viewBox="0 0 16 16">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">
<path d="M3.362 10.11c0 .926-.756 1.681-1.681 1.681S0 11.036 0 10.111C0 9.186.756 8.43 1.68 8.43h1.682v1.68zm.846 0c0-.924.756-1.68 1.681-1.68s1.681.756 1.681 1.68v4.21c0 .924-.756 1.68-1.68 1.68a1.685 1.685 0 0 1-1.682-1.68v-4.21zM5.89 3.362c-.926 0-1.682-.756-1.682-1.681S4.964 0 5.89 0s1.68.756 1.68 1.68v1.682H5.89zm0 .846c.924 0 1.68.756 1.68 1.681S6.814 7.57 5.89 7.57H1.68C.757 7.57 0 6.814 0 5.89c0-.926.756-1.682 1.68-1.682h4.21zm6.749 1.682c0-.926.755-1.682 1.68-1.682.925 0 1.681.756 1.681 1.681s-.756 1.681-1.68 1.681h-1.681V5.89zm-.848 0c0 .924-.755 1.68-1.68 1.68A1.685 1.685 0 0 1 8.43 5.89V1.68C8.43.757 9.186 0 10.11 0c.926 0 1.681.756 1.681 1.68v4.21zm-1.681 6.748c.926 0 1.682.756 1.682 1.681S11.036 16 10.11 16s-1.681-.756-1.681-1.68v-1.682h1.68zm0-.847c-.924 0-1.68-.755-1.68-1.68 0-.925.756-1.681 1.68-1.681h4.21c.924 0 1.68.756 1.68 1.68 0 .926-.756 1.681-1.68 1.681h-4.21z"/>
</svg>

Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 990 B

After

Width:  |  Height:  |  Size: 970 B

8
frontend/scripts/icons.js
View file

@ -25,8 +25,9 @@ const plugins = (removeFill = true) => {
name: 'preset-default',
params: {
overrides: {
removeViewBox: false,
inlineStyles: {
onlyMatchedOnce: false
onlyMatchedOnce: false,
}
}
}
@ -51,8 +52,6 @@ const plugins = (removeFill = true) => {
const iconPaths = [];
const dirs = getDirectories(ICONS_DIRNAME);
console.log(ICONS_DIRNAME, UI_DIRNAME, icons, dirs)
fs.mkdirSync(`${UI_DIRNAME}/Icons`, { recursive: true });
dirs.forEach((dir) => {
fs.mkdirSync(`${UI_DIRNAME}/Icons/${dir.replaceAll('-', '_')}`, { recursive: true });
@ -66,6 +65,9 @@ icons.forEach((icon) => {
const svg = fs.readFileSync(`${ICONS_DIRNAME}/${icon}`, 'utf-8');
const canOptimize = !icon.includes('integrations');
const { data } = optimize(svg, plugins(canOptimize));
if (titleCase(fileName) === 'Integrations_slack_bw') {
console.log(data, svg)
}
fs.writeFileSync(path, `
/* Auto-generated, do not edit */
import React from 'react';