Finally facing the consequences of hacky code

By fixing it with more hacky code
This commit is contained in:
Lim Chee Aun 2024-03-26 23:45:22 +08:00
parent 0a695410d9
commit 7049166b40

View file

@ -180,6 +180,8 @@ function Filters() {
);
}
let _id = 1;
const incID = () => _id++;
function FiltersAddEdit({ filter, onClose }) {
const { masto } = api();
const [uiState, setUIState] = useState('default');
@ -193,7 +195,12 @@ function FiltersAddEdit({ filter, onClose }) {
// Hacky way of handling removed keywords for both existing and new ones
const [removedKeywordIDs, setRemovedKeywordIDs] = useState([]);
const [removedNewKeywordIndices, setRemovedNewKeywordIndices] = useState([]);
const [removedKeyword_IDs, setRemovedKeyword_IDs] = useState([]);
const filteredEditKeywords = editKeywords.filter(
(k) =>
!removedKeywordIDs.includes(k.id) && !removedKeyword_IDs.includes(k._id),
);
return (
<div class="sheet" id="filters-add-edit-modal">
@ -335,16 +342,12 @@ function FiltersAddEdit({ filter, onClose }) {
</label>
</div>
<div class="filter-form-keywords" ref={keywordsRef}>
{editKeywords.length ? (
{filteredEditKeywords.length ? (
<ul class="filter-keywords">
{editKeywords.map((k, index) => {
const { id, keyword, wholeWord } = k;
const removed =
removedKeywordIDs.includes(id) ||
removedNewKeywordIndices.includes(index);
if (removed) return null;
{filteredEditKeywords.map((k) => {
const { id, keyword, wholeWord, _id } = k;
return (
<li key={`${index}-${id}`}>
<li key={`${id}-${_id}`}>
<input
type="hidden"
name="keyword_attributes[][id]"
@ -376,12 +379,9 @@ function FiltersAddEdit({ filter, onClose }) {
if (id) {
removedKeywordIDs.push(id);
setRemovedKeywordIDs([...removedKeywordIDs]);
} else {
// If no id, remove by index
removedNewKeywordIndices.push(index);
setRemovedNewKeywordIndices([
...removedNewKeywordIndices,
]);
} else if (_id) {
removedKeyword_IDs.push(_id);
setRemovedKeyword_IDs([...removedKeyword_IDs]);
}
}}
>
@ -405,6 +405,7 @@ function FiltersAddEdit({ filter, onClose }) {
setEditKeywords([
...editKeywords,
{
_id: incID(),
keyword: '',
wholeWord: true,
},
@ -421,10 +422,10 @@ function FiltersAddEdit({ filter, onClose }) {
>
Add keyword
</button>{' '}
{editKeywords?.length > 1 && (
{filteredEditKeywords?.length > 1 && (
<small class="insignificant">
{editKeywords.length} keyword
{editKeywords.length === 1 ? '' : 's'}
{filteredEditKeywords.length} keyword
{filteredEditKeywords.length === 1 ? '' : 's'}
</small>
)}
</footer>