Skip to content

Commit af011ab

Browse files
ArneiArnei
committed
Remove IconButton component
The IconButton component can be replaced with the similar ButtonLikeAnchor component. No need to have two very similar components, so this removes one of them.
1 parent e11a88c commit af011ab

50 files changed

Lines changed: 155 additions & 201 deletions

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

‎src/components/Header.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -281,7 +281,7 @@ const MenuLang = ({ handleChangeLanguage }: { handleChangeLanguage: (code: strin
281281
{languages.map((language, key) => (
282282
<li key={key}>
283283
<ButtonLikeAnchor
284-
extraClassName={(i18n.language === language.code ? "selected" : "")}
284+
className={(i18n.language === language.code ? "selected" : "")}
285285
onClick={() => handleChangeLanguage(language.code)}
286286
>
287287
{language.long}

‎src/components/configuration/partials/ThemesActionsCell.tsx‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -7,9 +7,9 @@ import { useAppDispatch } from "../../../store";
77
import { deleteTheme, ThemeDetailsType } from "../../../slices/themeSlice";
88
import ThemeDetails from "./wizard/ThemeDetails";
99
import { ActionCellDelete } from "../../shared/ActionCellDelete";
10-
import { IconButton } from "../../shared/IconButton";
1110
import { Modal, ModalHandle } from "../../shared/modals/Modal";
1211
import { useTranslation } from "react-i18next";
12+
import ButtonLikeAnchor from "../../shared/ButtonLikeAnchor";
1313

1414
/**
1515
* This component renders the action cells of themes in the table view
@@ -44,9 +44,9 @@ const ThemesActionsCell = ({
4444
return (
4545
<>
4646
{/* edit themes */}
47-
<IconButton
48-
callback={() => showThemeDetails()}
49-
iconClassname={"more"}
47+
<ButtonLikeAnchor
48+
onClick={() => showThemeDetails()}
49+
className={"more"}
5050
editAccessRole={"ROLE_UI_THEMES_EDIT"}
5151
tooltipText={"CONFIGURATION.THEMES.TABLE.TOOLTIP.DETAILS"}
5252
/>

‎src/components/events/partials/EventActionCell.tsx‎

Lines changed: 22 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -16,8 +16,8 @@ import { Event, deleteEvent } from "../../../slices/eventSlice";
1616
import { Tooltip } from "../../shared/Tooltip";
1717
import { openModal } from "../../../slices/eventDetailsSlice";
1818
import { ActionCellDelete } from "../../shared/ActionCellDelete";
19-
import { IconButton } from "../../shared/IconButton";
2019
import { Modal, ModalHandle } from "../../shared/modals/Modal";
20+
import ButtonLikeAnchor from "../../shared/ButtonLikeAnchor";
2121

2222
/**
2323
* This component renders the action cells of events in the table view
@@ -91,18 +91,18 @@ const EventActionCell = ({
9191
)}
9292

9393
{/* Open event details */}
94-
<IconButton
95-
callback={onClickEventDetails}
96-
iconClassname={"more"}
94+
<ButtonLikeAnchor
95+
onClick={onClickEventDetails}
96+
className={"more"}
9797
editAccessRole={"ROLE_UI_EVENTS_DETAILS_VIEW"}
9898
tooltipText={"EVENTS.EVENTS.TABLE.TOOLTIP.DETAILS"}
9999
/>
100100

101101
{/* If event belongs to a series then the corresponding series details can be opened */}
102102
{!!row.series && (
103-
<IconButton
104-
callback={onClickSeriesDetails}
105-
iconClassname={"more-series"}
103+
<ButtonLikeAnchor
104+
onClick={onClickSeriesDetails}
105+
className={"more-series"}
106106
editAccessRole={"ROLE_UI_SERIES_DETAILS_VIEW"}
107107
tooltipText={"EVENTS.SERIES.TABLE.TOOLTIP.DETAILS"}
108108
/>
@@ -139,45 +139,45 @@ const EventActionCell = ({
139139

140140
{/* If the event has comments and no open comments then the comment tab of event details can be opened directly */}
141141
{row.has_comments && !row.has_open_comments && (
142-
<IconButton
143-
callback={() => onClickComments()}
144-
iconClassname={"comments"}
142+
<ButtonLikeAnchor
143+
onClick={() => onClickComments()}
144+
className={"comments"}
145145
tooltipText={"EVENTS.EVENTS.TABLE.TOOLTIP.COMMENTS"}
146146
/>
147147
)}
148148

149149
{/* If the event has comments and open comments then the comment tab of event details can be opened directly */}
150150
{row.has_comments && row.has_open_comments && (
151-
<IconButton
152-
callback={() => onClickComments()}
153-
iconClassname={"comments-open"}
151+
<ButtonLikeAnchor
152+
onClick={() => onClickComments()}
153+
className={"comments-open"}
154154
tooltipText={"EVENTS.EVENTS.TABLE.TOOLTIP.COMMENTS"}
155155
/>
156156
)}
157157

158158
{/*If the event is in in a paused workflow state then a warning icon is shown and workflow tab of event
159159
details can be opened directly */}
160160
{row.workflow_state === "PAUSED" &&
161-
<IconButton
162-
callback={() => onClickWorkflow()}
163-
iconClassname={"fa fa-warning"}
161+
<ButtonLikeAnchor
162+
onClick={() => onClickWorkflow()}
163+
className={"fa fa-warning"}
164164
editAccessRole={"ROLE_UI_EVENTS_DETAILS_WORKFLOWS_EDIT"}
165165
tooltipText={"EVENTS.EVENTS.TABLE.TOOLTIP.PAUSED_WORKFLOW"}
166166
/>
167167
}
168168

169169
{/* Open assets tab of event details directly*/}
170-
<IconButton
171-
callback={() => onClickAssets()}
172-
iconClassname={"fa fa-folder-open"}
170+
<ButtonLikeAnchor
171+
onClick={() => onClickAssets()}
172+
className={"fa fa-folder-open"}
173173
editAccessRole={"ROLE_UI_EVENTS_DETAILS_ASSETS_VIEW"}
174174
tooltipText={"EVENTS.EVENTS.TABLE.TOOLTIP.ASSETS"}
175175
/>
176176

177177
{/* Open dialog for embedded code*/}
178-
<IconButton
179-
callback={() => showEmbeddingCodeModal()}
180-
iconClassname={"fa fa-link"}
178+
<ButtonLikeAnchor
179+
onClick={() => showEmbeddingCodeModal()}
180+
className={"fa fa-link"}
181181
editAccessRole={"ROLE_UI_EVENTS_EMBEDDING_CODE_VIEW"}
182182
tooltipText={"EVENTS.EVENTS.TABLE.TOOLTIP.EMBEDDING_CODE"}
183183
/>

‎src/components/events/partials/EventsLocationCell.tsx‎

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ import { loadEventsIntoTable } from "../../../thunks/tableThunks";
55
import { useAppDispatch, useAppSelector } from "../../../store";
66
import { fetchEvents } from "../../../slices/eventSlice";
77
import { Event } from "../../../slices/eventSlice";
8-
import { IconButton } from "../../shared/IconButton";
8+
import ButtonLikeAnchor from "../../shared/ButtonLikeAnchor";
99

1010
/**
1111
* This component renders the location cells of events in the table view
@@ -31,13 +31,13 @@ const EventsLocationCell = ({
3131

3232
return (
3333
// Link template for location of event
34-
<IconButton
35-
callback={() => addFilter(row.location)}
36-
iconClassname={"crosslink"}
34+
<ButtonLikeAnchor
35+
onClick={() => addFilter(row.location)}
36+
className={"crosslink"}
3737
tooltipText={"EVENTS.EVENTS.TABLE.TOOLTIP.LOCATION"}
3838
>
3939
{row.location}
40-
</IconButton>
40+
</ButtonLikeAnchor>
4141
);
4242
};
4343

‎src/components/events/partials/EventsSeriesCell.tsx‎

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ import { loadEventsIntoTable } from "../../../thunks/tableThunks";
55
import { useAppDispatch, useAppSelector } from "../../../store";
66
import { fetchEvents } from "../../../slices/eventSlice";
77
import { Event } from "../../../slices/eventSlice";
8-
import { IconButton } from "../../shared/IconButton";
8+
import ButtonLikeAnchor from "../../shared/ButtonLikeAnchor";
99

1010
/**
1111
* This component renders the series cells of events in the table view
@@ -32,16 +32,16 @@ const EventsSeriesCell = ({
3232
return (
3333
!!row.series ? (
3434
// Link template for series of event
35-
<IconButton
36-
callback={() => row.series
35+
<ButtonLikeAnchor
36+
onClick={() => row.series
3737
? addFilter(row.series.id)
3838
: console.error("Tried to sort by a series, but the series did not exist.")
3939
}
40-
iconClassname={"crosslink"}
40+
className={"crosslink"}
4141
tooltipText={"EVENTS.EVENTS.TABLE.TOOLTIP.SERIES"}
4242
>
4343
{row.series.title}
44-
</IconButton>
44+
</ButtonLikeAnchor>
4545
)
4646
: <></>
4747
);

‎src/components/events/partials/EventsStatusCell.tsx‎

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -8,8 +8,8 @@ import {
88
} from "../../../slices/eventDetailsSlice";
99
import { EventDetailsPage } from "./modals/EventDetails";
1010
import { hasScheduledStatus } from "../../../utils/eventDetailsUtils";
11-
import { IconButton } from "../../shared/IconButton";
1211
import { ParseKeys } from "i18next";
12+
import ButtonLikeAnchor from "../../shared/ButtonLikeAnchor";
1313

1414
/**
1515
* This component renders the status cells of events in the table view
@@ -42,13 +42,13 @@ const EventsStatusCell = ({
4242
};
4343

4444
return (
45-
<IconButton
46-
callback={() => openStatusModal()}
47-
iconClassname={"crosslink"}
45+
<ButtonLikeAnchor
46+
onClick={() => openStatusModal()}
47+
className={"crosslink"}
4848
tooltipText={"EVENTS.EVENTS.TABLE.TOOLTIP.STATUS"}
4949
>
5050
{t(row.displayable_status as ParseKeys)}
51-
</IconButton>
51+
</ButtonLikeAnchor>
5252
);
5353
};
5454

‎src/components/events/partials/EventsTechnicalDateCell.tsx‎

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@ import { useAppDispatch, useAppSelector } from "../../../store";
77
import { fetchEvents } from "../../../slices/eventSlice";
88
import { renderValidDate } from "../../../utils/dateUtils";
99
import { Event } from "../../../slices/eventSlice";
10-
import { IconButton } from "../../shared/IconButton";
10+
import ButtonLikeAnchor from "../../shared/ButtonLikeAnchor";
1111

1212
/**
1313
* This component renders the technical date cells of events in the table view
@@ -34,13 +34,13 @@ const EventsTechnicalDateCell = ({
3434

3535
return (
3636
// Link template for technical date of event
37-
<IconButton
38-
callback={() => addFilter(row.date)}
39-
iconClassname={"crosslink"}
37+
<ButtonLikeAnchor
38+
onClick={() => addFilter(row.date)}
39+
className={"crosslink"}
4040
tooltipText={"EVENTS.EVENTS.TABLE.TOOLTIP.START"}
4141
>
4242
{t("dateFormats.date.short", { date: renderValidDate(row.technical_start) })}
43-
</IconButton>
43+
</ButtonLikeAnchor>
4444
);
4545
};
4646

‎src/components/events/partials/ModalTabsAndPages/DetailsTobiraTab.tsx‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -215,7 +215,7 @@ const TobiraTable = ({ tobiraData, i18nKey, openSubTab, handleDelete }: TobiraTa
215215
{t(`EVENTS.${i18nKey}.DETAILS.TOBIRA.NOT_MOUNTED`)}
216216
{i18nKey === "SERIES" && <ButtonLikeAnchor
217217
style={{ margin: 5 }}
218-
extraClassName="edit fa fa-pencil-square pull-right"
218+
className="edit fa fa-pencil-square pull-right"
219219
onClick={() => openSubTab("edit-path")}
220220
tooltipText="EVENTS.SERIES.DETAILS.TOBIRA.MOUNT_SERIES"
221221
/>}
@@ -247,12 +247,12 @@ const TobiraTable = ({ tobiraData, i18nKey, openSubTab, handleDelete }: TobiraTa
247247
<ButtonLikeAnchor
248248
style={{ margin: 5 }}
249249
onClick={() => deleteConfirmationModalRef.current?.open()}
250-
extraClassName="remove pull-right"
250+
className="remove pull-right"
251251
tooltipText="EVENTS.SERIES.DETAILS.TOBIRA.REMOVE_PATH"
252252
/>
253253
<ButtonLikeAnchor
254254
style={{ margin: 5 }}
255-
extraClassName="edit fa fa-pencil-square pull-right"
255+
className="edit fa fa-pencil-square pull-right"
256256
onClick={() => openSubTab("edit-path", hostPage)}
257257
tooltipText="EVENTS.SERIES.DETAILS.TOBIRA.EDIT_PATH"
258258
/>

‎src/components/events/partials/ModalTabsAndPages/EventDetailsAssetAttachments.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -94,7 +94,7 @@ const EventDetailsAssetAttachments = ({
9494
</td>
9595
<td>
9696
<ButtonLikeAnchor
97-
extraClassName="details-link"
97+
className="details-link"
9898
onClick={() =>
9999
openSubTab("attachment-details", item.id)
100100
}

‎src/components/events/partials/ModalTabsAndPages/EventDetailsAssetCatalogs.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -90,7 +90,7 @@ const EventDetailsAssetCatalogs = ({
9090
</td>
9191
<td>
9292
<ButtonLikeAnchor
93-
extraClassName="details-link"
93+
className="details-link"
9494
onClick={() =>
9595
openSubTab("catalog-details", item.id)
9696
}

0 commit comments

Comments
 (0)