diff --git a/uli-website/src/pages/hidden-words-for-thread.jsx b/uli-website/src/pages/hidden-words-for-thread.jsx
index 5cb51113..df35f40b 100644
--- a/uli-website/src/pages/hidden-words-for-thread.jsx
+++ b/uli-website/src/pages/hidden-words-for-thread.jsx
@@ -1,4 +1,4 @@
-import React, { useState } from "react";
+import React, { useState, useEffect, useRef } from "react";
import {
Box,
Heading,
@@ -36,11 +36,24 @@ const HiddenWordsForThread = () => {
});
const defaultOptions = selectOptions.map((option) => option.value);
const [choices, setChoices] = useState(defaultOptions);
+ const [text, setText] = useState("");
+ const textAreaRef = useRef(null);
+
+ useEffect(() => {
+ // Compute the text value based on choices and update the state
+ const computedText = choices
+ .map((choice) => options[choice].slurs.join(", "))
+ .join(", ");
+ setText(computedText);
+ }, [choices]);
+
+ function handleTextAreaChange(event) {
+ const currentValue = event.target.value;
+ setText(currentValue);
+ }
function clickCopyToClipboard() {
- navigator.clipboard.writeText(
- choices.map((choice) => options[choice].slurs.join(", ")).join(", ")
- );
+ navigator.clipboard.writeText(text);
}
return (
@@ -51,7 +64,7 @@ const HiddenWordsForThread = () => {
Meta's Thread now allows you to filter out words that you don't want
to see on your feed. Uli's slur list can assist you in adding a list
- of slurs in Indian languages. If you are being targetted or abused
+ of slurs in Indian languages. If you are being targeted or abused
on social media in Indian languages, consider adding these words to
your list of "hidden words" on Thread
@@ -77,10 +90,10 @@ const HiddenWordsForThread = () => {
Contribute