Skip to content

Commit 4f1b0e5

Browse files
committed
fix: all icon imports and icons
1 parent 93facfe commit 4f1b0e5

18 files changed

+79
-54
lines changed

Diff for: src/components/MUI.stories.tsx

+2-2
Original file line numberDiff line numberDiff line change
@@ -21,7 +21,7 @@ import {
2121
} from "@mui/material";
2222

2323
import { StoryGrid } from "src/components/storybook/StoryGrid";
24-
import { IconAreaChart } from "src/icons/old/ic-area-chart";
24+
import { Icon } from "src/icons";
2525

2626
const StoryContainer = ({ children }: { children: React.ReactNode }) => {
2727
return (
@@ -326,7 +326,7 @@ export const ChipStory = () => (
326326
<Chip label="Clickable" onClick={() => {}} />
327327
<Chip label="Deletable" onDelete={() => {}} />
328328
<Chip avatar={<Avatar>M</Avatar>} label="With Avatar" />
329-
<Chip icon={<IconAreaChart />} label="With Icon" />
329+
<Chip icon={<Icon name="linechart" />} label="With Icon" />
330330
</Stack>
331331
<Typography variant="subtitle1" gutterBottom>
332332
Colors

Diff for: src/components/combobox.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ import TextField, { TextFieldProps } from "@mui/material/TextField";
55
import { useEffect, useMemo, useState } from "react";
66

77
import { InfoDialogButton } from "src/components/info-dialog";
8-
import { Icon } from "src/icons/old";
8+
import { Icon } from "src/icons";
99

1010
export type ComboboxMultiProps = {
1111
id: string;

Diff for: src/components/detail-page/banner.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@ import { Fragment, useState } from "react";
77
import { HomeLink } from "src/components/links";
88
import { Search } from "src/components/search";
99
import { Entity } from "src/domain/data";
10-
import { Icon } from "src/icons/old";
10+
import { Icon } from "src/icons";
1111

1212
const TRUNCATE_COUNT = 5;
1313

Diff for: src/components/footer.tsx

+6-6
Original file line numberDiff line numberDiff line change
@@ -5,9 +5,9 @@ import { PropsWithChildren } from "react";
55
import { HelpDialog } from "src/components/info-dialog";
66
import { LogoDesktop } from "src/components/logo";
77
import { useDisclosure } from "src/components/use-disclosure";
8-
import { IconDownload } from "src/icons/old/ic-download";
9-
import { IconInfo } from "src/icons/old/ic-info";
10-
import { IconShare } from "src/icons/old/ic-share";
8+
import { IconDownload } from "src/icons/ic-download";
9+
import { IconInfoCircle } from "src/icons/ic-info-circle";
10+
import { IconShare } from "src/icons/ic-share";
1111
import { useLocale } from "src/lib/use-locale";
1212
import { useQueryStateSingle } from "src/lib/use-query-state";
1313

@@ -104,7 +104,7 @@ export const Footer = () => {
104104
sx={{ cursor: "pointer" }}
105105
onClick={handleOpenCalculation}
106106
href="#"
107-
icon={<IconInfo />}
107+
icon={<IconInfoCircle />}
108108
>
109109
{t({
110110
id: "footer.calculation-basics",
@@ -186,7 +186,7 @@ export const Footer = () => {
186186
sx={{ p: 0, width: 24, height: 24, cursor: "pointer" }}
187187
onClick={handleOpenCsvDownload}
188188
>
189-
<IconInfo />
189+
<IconInfoCircle />
190190
</IconButton>
191191
<IconDownload />
192192
</Box>
@@ -203,7 +203,7 @@ export const Footer = () => {
203203
sx={{ p: 0, width: 24, height: 24, cursor: "pointer" }}
204204
onClick={handleOpenMunicipalitiesInfo}
205205
>
206-
<IconInfo />
206+
<IconInfoCircle />
207207
</IconButton>
208208
<IconDownload />
209209
</Box>

Diff for: src/components/form.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,7 @@ import * as React from "react";
1313
import { ReactNode } from "react";
1414

1515
import { VisuallyHidden } from "src/components/visually-hidden";
16-
import { Icon } from "src/icons/old";
16+
import { Icon } from "src/icons";
1717

1818
type Option = {
1919
value: string | $FixMe;

Diff for: src/components/hint.tsx

+4-4
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@ import { Trans } from "@lingui/macro";
33
import { Box, BoxProps, Typography } from "@mui/material";
44
import { ReactNode } from "react";
55

6-
import { Icon, IconName } from "src/icons/old";
6+
import { Icon, IconName } from "src/icons";
77

88
const delayedShow = keyframes`
99
0% { opacity: 0 }
@@ -130,7 +130,7 @@ export const NoDataHint = () => (
130130
}}
131131
display="flex"
132132
>
133-
<Icon name="warning" size={64} />
133+
<Icon name="warningcircle" size={64} />
134134
<Typography variant="h2" sx={{ my: 3 }}>
135135
<Trans id="hint.nodata.title">Keine Daten</Trans>
136136
</Typography>
@@ -157,7 +157,7 @@ export const NoContentHint = () => (
157157
}}
158158
display="flex"
159159
>
160-
<Icon name="warning" size={48} />
160+
<Icon name="warningcircle" size={48} />
161161
<Typography variant="body2" sx={{ maxWidth: "40rem" }}>
162162
<Trans id="hint.nocontent.message">
163163
Dieser Inhalt konnte nicht geladen werden
@@ -181,7 +181,7 @@ export const NoGeoDataHint = () => (
181181
}}
182182
display="flex"
183183
>
184-
<Icon name="warning" size={64} />
184+
<Icon name="warningcircle" size={64} />
185185
<Typography variant="h2" sx={{ my: 3 }}>
186186
<Trans id="hint.nogeodata.title">Keine Kartendarstellung möglich</Trans>
187187
</Typography>

Diff for: src/components/info-banner.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -30,7 +30,7 @@ export const InfoBanner = ({
3030
}
3131

3232
return (
33-
<HintBlue iconName="info">
33+
<HintBlue iconName="infocircle">
3434
{
3535
<Box
3636
component="section"

Diff for: src/components/info-dialog.tsx

+2-2
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,7 @@ import { LoadingIcon, NoContentHint } from "src/components/hint";
1414
import { useDisclosure } from "src/components/use-disclosure";
1515
import { VisuallyHidden } from "src/components/visually-hidden";
1616
import { useWikiContentQuery } from "src/graphql/queries";
17-
import { Icon } from "src/icons/old";
17+
import { Icon } from "src/icons";
1818
import { useLocale } from "src/lib/use-locale";
1919
import { theme } from "src/themes/elcom";
2020

@@ -180,7 +180,7 @@ export const InfoDialogButton = ({
180180
>
181181
<Box sx={{ alignItems: "center" }} display="flex">
182182
<Box sx={{ flexShrink: 0, mr: iconOnly ? 0 : 2 }}>
183-
<Icon name="info" size={smaller ? 16 : 20} />
183+
<Icon name="infocircle" size={smaller ? 16 : 20} />
184184
</Box>{" "}
185185
{iconOnly ? <VisuallyHidden>{label}</VisuallyHidden> : label}
186186
</Box>

Diff for: src/components/list.tsx

+2-3
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,6 @@
11
import { t, Trans } from "@lingui/macro";
22
import { Box, Button, Link, Typography } from "@mui/material";
3-
import { ascending, descending, mean, rollup } from "d3";
4-
import { ScaleThreshold } from "d3";
3+
import { ascending, descending, mean, rollup, ScaleThreshold } from "d3";
54
import NextLink from "next/link";
65
import { useRouter } from "next/router";
76
import { useContext, useMemo, useState } from "react";
@@ -17,7 +16,7 @@ import {
1716
CantonMedianObservationFieldsFragment,
1817
OperatorObservationFieldsFragment,
1918
} from "src/graphql/queries";
20-
import { Icon } from "src/icons/old";
19+
import { Icon } from "src/icons";
2120

2221
const ListItem = ({
2322
id,

Diff for: src/components/operator-documents.tsx

+2-2
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@ import {
99
OperatorDocumentCategory,
1010
useOperatorDocumentsQuery,
1111
} from "src/graphql/queries";
12-
import { Icon } from "src/icons/old";
12+
import { Icon } from "src/icons";
1313
import { EMPTY_ARRAY } from "src/lib/empty-array";
1414
import { useLocale } from "src/lib/use-locale";
1515

@@ -50,7 +50,7 @@ const DocumentList = ({
5050
<Link href={doc.url} variant="inline">
5151
<Box display="flex">
5252
<Box sx={{ flexShrink: 0, mr: 2 }}>
53-
<Icon name="pdf" size={20} />
53+
<Icon name="file" size={20} />
5454
</Box>{" "}
5555
{itemLabel} {doc.year}(
5656
<Trans id="download.filetype.pdf">PDF-Datei</Trans>)

Diff for: src/components/price-color-legend.tsx

+3-4
Original file line numberDiff line numberDiff line change
@@ -5,8 +5,7 @@ import { useState } from "react";
55

66
import { InfoDialogButton } from "src/components/info-dialog";
77
import { useFormatCurrency } from "src/domain/helpers";
8-
import { IconClear } from "src/icons/old/ic-clear";
9-
import { IconInfo } from "src/icons/old/ic-info";
8+
import { Icon } from "src/icons";
109

1110
const LEGEND_WIDTH = 215;
1211
const TOP_LABEL_HEIGHT = 14;
@@ -44,7 +43,7 @@ export const MapPriceColorLegend = ({
4443
}}
4544
display="flex"
4645
>
47-
<IconInfo color="#333" />
46+
<Icon name="infocircle" color="#333" />
4847
</Box>
4948
</LegendBox>
5049
);
@@ -76,7 +75,7 @@ export const MapPriceColorLegend = ({
7675
justifyContent: "flex-end",
7776
}}
7877
>
79-
<IconClear size={16} color="#666" />
78+
<Icon name="clear" size={16} color="#666" />
8079
</Box>
8180
</Box>
8281
<Box

Diff for: src/components/search.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,7 @@ import { VisuallyHidden } from "src/components/visually-hidden";
2020
import { analyticsSiteSearch } from "src/domain/analytics";
2121
import { getLocalizedLabel } from "src/domain/translation";
2222
import { useSearchQuery } from "src/graphql/queries";
23-
import { Icon } from "src/icons/old";
23+
import { Icon } from "src/icons";
2424
import { EMPTY_ARRAY } from "src/lib/empty-array";
2525
import { useLocale } from "src/lib/use-locale";
2626

Diff for: src/icons/ic-warning-circle1.tsx

-21
This file was deleted.

Diff for: src/icons/index.tsx

+7-3
Original file line numberDiff line numberDiff line change
@@ -92,9 +92,11 @@ import { IconUnpin } from "./ic-unpin";
9292
import { IconUpload } from "./ic-upload";
9393
import { IconWarningCircle } from "./ic-warning-circle";
9494
import { IconWarningCircleFilled } from "./ic-warning-circle-filled";
95-
import { IconWarningCircle1 } from "./ic-warning-circle1";
9695
import { IconWiFi } from "./ic-wi-fi";
9796
import { IconYoutube } from "./ic-youtube";
97+
import { IconCopy } from "./old/ic-copy";
98+
import { IconLoading } from "./old/ic-loading";
99+
import { IconPdf } from "./old/ic-pdf";
98100

99101
const Icons = {
100102
apps: IconApps,
@@ -115,7 +117,7 @@ const Icons = {
115117
checkmarkcircle: IconCheckmarkCircle,
116118
chevondoubleleft: IconChevronDoubleLeft,
117119
chevondoubleright: IconChevronDoubleRight,
118-
chevondown: IconChevronDown,
120+
chevrondown: IconChevronDown,
119121
chevronleft: IconChevronLeft,
120122
chevronlineleft: IconChevronLineLeft,
121123
chevronlineright: IconChevronLineRight,
@@ -128,6 +130,7 @@ const Icons = {
128130
circle: IconCircle,
129131
clear: IconClear,
130132
close: IconClose,
133+
copy: IconCopy,
131134
desktop: IconDesktop,
132135
dots: IconDots,
133136
download: IconDownload,
@@ -158,6 +161,7 @@ const Icons = {
158161
linkexternal: IconLinkExternal,
159162
listbullet: IconListBullet,
160163
listnumber: IconListNumber,
164+
loading: IconLoading,
161165
login: IconLogin,
162166
logout: IconLogout,
163167
mapmarker: IconMapMarker,
@@ -168,6 +172,7 @@ const Icons = {
168172
more: IconMore,
169173
morefilled: IconMoreFilled,
170174
organisations: IconOrganisations,
175+
pdf: IconPdf,
171176
pen: IconPen,
172177
piechart: IconPieChart,
173178
pin: IconPin,
@@ -190,7 +195,6 @@ const Icons = {
190195
unpin: IconUnpin,
191196
upload: IconUpload,
192197
warningcircle: IconWarningCircle,
193-
warningcircle1: IconWarningCircle1,
194198
warningcirclefilled: IconWarningCircleFilled,
195199
wifi: IconWiFi,
196200
youtube: IconYoutube,

Diff for: src/icons/old/ic-copy.tsx

+14
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
import * as React from "react";
2+
3+
export const IconCopy = ({ size = 24, color = "currentColor" }) => (
4+
<svg width={size} height={size} viewBox="0 0 24 24">
5+
<path
6+
d="M22 22H6V6h16v16zM20 8H8v12h12V8zM2 14V2h12v4h2V0H0v16h6v-2H2z"
7+
transform="translate(1 1)"
8+
fill={color}
9+
stroke="none"
10+
strokeWidth={1}
11+
fillRule="evenodd"
12+
/>
13+
</svg>
14+
);

Diff for: src/icons/old/ic-loading.tsx

+18
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
import * as React from "react";
2+
3+
export const IconLoading = ({ size = 64, color = "currentColor" }) => (
4+
<svg
5+
xmlns="http://www.w3.org/2000/svg"
6+
width={size}
7+
height={size}
8+
viewBox="0 0 64 64"
9+
fill="none"
10+
fillRule="evenodd"
11+
stroke={color}
12+
strokeWidth="3"
13+
strokeLinecap="round"
14+
strokeLinejoin="round"
15+
>
16+
<path d="M32,12 C20.954305,12 12,20.954305 12,32 C12,43.045695 20.954305,52 32,52 C43.045695,52 52,43.045695 52,32"></path>
17+
</svg>
18+
);

Diff for: src/icons/old/ic-pdf.tsx

+12
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
export const IconPdf = ({ size = 24, color = "currentColor" }) => (
2+
<svg width={size} height={size} viewBox="0 0 22 24">
3+
<path
4+
d="M21.174 4.674l-3.349-3.348C17.097.596 15.656 0 14.625 0H3.375C2.344 0 1.5.844 1.5 2.625v20.25c0 .281.844 1.125 1.875 1.125h17.25a1.88 1.88 0 001.875-1.875V7.875c0-1.031-.597-2.472-1.326-3.201zM16.5 2.169c.102.071.192.144.265.217l3.348 3.348c.073.074.146.163.217.265h-3.831V2.168l.001.001zM3 1.875a.38.38 0 01.375-.375h11.25c.113 0 .24.014.375.04V7.5h5.96c.026.135.04.262.04.375V9H3V1.875zM20.625 22.5H3.375A.38.38 0 013 22.125V19.5h18v2.625a.38.38 0 01-.375.375zm-.072-8.818v1.342h-2.609v2.739h-1.591v-7.058h4.655v1.343h-3.064v1.635h2.609v-.001zm-5.847.52c0 .607-.081 1.134-.244 1.582a2.98 2.98 0 01-.682 1.109c-.293.292-.64.511-1.045.655a3.98 3.98 0 01-1.342.217H9.39v-7.059h1.916c.512 0 .978.068 1.397.205.419.137.776.348 1.072.634.296.285.525.648.688 1.088.163.44.244.963.244 1.57l-.001-.001zm-2.149-1.738a1.386 1.386 0 00-.585-.363 2.458 2.458 0 00-.752-.108h-.227v4.482h.227c.274 0 .525-.04.752-.119.227-.079.422-.208.585-.385.163-.177.289-.409.379-.698.09-.289.135-.646.135-1.072 0-.418-.045-.77-.135-1.055a1.724 1.724 0 00-.379-.682zm-4.227.514c0 .413-.075.769-.222 1.072a2.067 2.067 0 01-.601.747 2.545 2.545 0 01-.877.433 3.875 3.875 0 01-1.061.141h-.986v2.392H2.992v-7.058h2.577c.382 0 .742.038 1.077.114.335.076.628.202.877.379s.445.412.59.704c.145.293.217.653.217 1.078v-.002zm-2.858-1.007h-.889v2.133l.889.001c.859 0 1.288-.375 1.288-1.127 0-.368-.108-.628-.325-.779-.217-.151-.538-.227-.964-.227l.001-.001z"
5+
transform="translate(-1)"
6+
fill={color}
7+
stroke="none"
8+
strokeWidth={1}
9+
fillRule="evenodd"
10+
/>
11+
</svg>
12+
);

Diff for: src/pages/index.tsx

+2-2
Original file line numberDiff line numberDiff line change
@@ -28,7 +28,7 @@ import {
2828
useAllMunicipalitiesQuery,
2929
useObservationsQuery,
3030
} from "src/graphql/queries";
31-
import { IconCopy } from "src/icons/old/ic-copy";
31+
import { Icon } from "src/icons";
3232
import { copyToClipboard } from "src/lib/copy-to-clipboard";
3333
import { EMPTY_ARRAY } from "src/lib/empty-array";
3434
import { useQueryStateSingle } from "src/lib/use-query-state";
@@ -167,7 +167,7 @@ const ShareButton = () => {
167167
},
168168
}}
169169
>
170-
<IconCopy />
170+
<Icon name="copy" />
171171
</Button>
172172
</Box>
173173
</TooltipBox>

0 commit comments

Comments
 (0)