-
-
Notifications
You must be signed in to change notification settings - Fork 29
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
feat: create ui to copy paste slurs for instagram and thread users. #297
- Loading branch information
1 parent
58dbaeb
commit dd18b1f
Showing
7 changed files
with
714 additions
and
13 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,99 @@ | ||
import React, { useState } from "react"; | ||
import { | ||
Box, | ||
Heading, | ||
Text, | ||
Paragraph, | ||
Anchor, | ||
CheckBoxGroup, | ||
Button, | ||
TextArea, | ||
} from "grommet"; | ||
import AppShell from "../components/molecules/AppShell"; | ||
import slurHindi from "../slurs/hindi.json"; | ||
import slurHinglish from "../slurs/hinglish.json"; | ||
import slurTamil from "../slurs/tamil.json"; | ||
import { CTALinkPlainPrimary } from "../components/atoms/UliCore"; | ||
|
||
const options = { | ||
hindi: { | ||
label: "Hindi", | ||
slurs: slurHindi, | ||
}, | ||
tamil: { | ||
label: "Tamil", | ||
slurs: slurTamil, | ||
}, | ||
hinglish: { | ||
label: "Hinglish", | ||
slurs: slurHinglish, | ||
}, | ||
}; | ||
|
||
const HiddenWordsForInstagram = () => { | ||
const selectOptions = Object.keys(options).map((option) => { | ||
return { label: options[option].label, value: option }; | ||
}); | ||
const defaultOptions = selectOptions.map((option) => option.value); | ||
const [choices, setChoices] = useState(defaultOptions); | ||
|
||
function clickCopyToClipboard() { | ||
navigator.clipboard.writeText( | ||
choices.map((choice) => options[choice].slurs.join(", ")).join(", ") | ||
); | ||
} | ||
|
||
return ( | ||
<AppShell> | ||
<Box align="center" margin={"large"}> | ||
<Box width={"large"}> | ||
<Heading level={1}>Hidden Words for Instagram</Heading> | ||
<Paragraph fill> | ||
Instagram 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 on | ||
social media in Indian languages, consider adding these words to | ||
your list of "hidden words" on Instagram | ||
</Paragraph> | ||
|
||
<Box direction="row-responsive" gap={"medium"} align="center"> | ||
<Text> Choose Languages</Text> | ||
<CheckBoxGroup | ||
direction={"row-responsive"} | ||
gap="small" | ||
options={selectOptions} | ||
value={choices} | ||
onChange={({ value, option }) => { | ||
setChoices(value); | ||
}} | ||
></CheckBoxGroup> | ||
<Box flex={"grow"}></Box> | ||
<Button onClick={clickCopyToClipboard}> | ||
<CTALinkPlainPrimary> | ||
<Text>Copy to Clipboard</Text> | ||
</CTALinkPlainPrimary> | ||
</Button> | ||
</Box> | ||
<Box height={"1.2em"} /> | ||
<Box height={"50vh"}> | ||
<TextArea | ||
fill | ||
value={choices | ||
.map((choice) => options[choice].slurs.join(", ")) | ||
.join(", ")} | ||
/> | ||
</Box> | ||
<Heading level={2}>Contribute</Heading> | ||
<Paragraph fill margin={"none"}> | ||
These slurs were crowdsourced from social media users in India who | ||
are on the receiving end of abuse. If you would like to share your | ||
list of words with us and grow this list, reach out to us at | ||
[email protected] | ||
</Paragraph> | ||
</Box> | ||
</Box> | ||
</AppShell> | ||
); | ||
}; | ||
|
||
export default HiddenWordsForInstagram; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,99 @@ | ||
import React, { useState } from "react"; | ||
import { | ||
Box, | ||
Heading, | ||
Text, | ||
Paragraph, | ||
Anchor, | ||
CheckBoxGroup, | ||
Button, | ||
TextArea, | ||
} from "grommet"; | ||
import AppShell from "../components/molecules/AppShell"; | ||
import slurHindi from "../slurs/hindi.json"; | ||
import slurHinglish from "../slurs/hinglish.json"; | ||
import slurTamil from "../slurs/tamil.json"; | ||
import { CTALinkPlainPrimary } from "../components/atoms/UliCore"; | ||
|
||
const options = { | ||
hindi: { | ||
label: "Hindi", | ||
slurs: slurHindi, | ||
}, | ||
tamil: { | ||
label: "Tamil", | ||
slurs: slurTamil, | ||
}, | ||
hinglish: { | ||
label: "Hinglish", | ||
slurs: slurHinglish, | ||
}, | ||
}; | ||
|
||
const HiddenWordsForThread = () => { | ||
const selectOptions = Object.keys(options).map((option) => { | ||
return { label: options[option].label, value: option }; | ||
}); | ||
const defaultOptions = selectOptions.map((option) => option.value); | ||
const [choices, setChoices] = useState(defaultOptions); | ||
|
||
function clickCopyToClipboard() { | ||
navigator.clipboard.writeText( | ||
choices.map((choice) => options[choice].slurs.join(", ")).join(", ") | ||
); | ||
} | ||
|
||
return ( | ||
<AppShell> | ||
<Box align="center" margin={"large"}> | ||
<Box width={"large"}> | ||
<Heading level={1}>Hidden Words for Thread</Heading> | ||
<Paragraph fill> | ||
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 | ||
on social media in Indian languages, consider adding these words to | ||
your list of "hidden words" on Thread | ||
</Paragraph> | ||
|
||
<Box direction="row-responsive" gap={"medium"} align="center"> | ||
<Text> Choose Languages</Text> | ||
<CheckBoxGroup | ||
direction={"row-responsive"} | ||
gap="small" | ||
options={selectOptions} | ||
value={choices} | ||
onChange={({ value, option }) => { | ||
setChoices(value); | ||
}} | ||
></CheckBoxGroup> | ||
<Box flex={"grow"}></Box> | ||
<Button onClick={clickCopyToClipboard}> | ||
<CTALinkPlainPrimary> | ||
<Text>Copy to Clipboard</Text> | ||
</CTALinkPlainPrimary> | ||
</Button> | ||
</Box> | ||
<Box height={"1.2em"} /> | ||
<Box height={"50vh"}> | ||
<TextArea | ||
fill | ||
value={choices | ||
.map((choice) => options[choice].slurs.join(", ")) | ||
.join(", ")} | ||
/> | ||
</Box> | ||
<Heading level={2}>Contribute</Heading> | ||
<Paragraph fill> | ||
These slurs were crowdsourced from social media users in India who | ||
are on the receiving end of abuse. If you would like to share your | ||
list of words with us and grow this list, reach out to us at | ||
[email protected] | ||
</Paragraph> | ||
</Box> | ||
</Box> | ||
</AppShell> | ||
); | ||
}; | ||
|
||
export default HiddenWordsForThread; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,117 @@ | ||
[ | ||
"जिहादी", | ||
"छक्का", | ||
"छिनाल", | ||
"रंडी", | ||
"रण्डी", | ||
"रांड", | ||
"रंडीखाना", | ||
"रण्डी रोना", | ||
"लुल्ली", | ||
"गांड", | ||
"गा#", | ||
"कुतिया", | ||
"कुत्ती", | ||
"बत्तमीज़", | ||
"कुल्टा", | ||
"हरामजादी", | ||
"साली", | ||
"चो#", | ||
"चुदाई", | ||
"मा के भोसड़े", | ||
"भोस्डीके", | ||
"भोछडी वाला", | ||
"लोड़ू", | ||
"बहन चोद", | ||
"मादरचोद", | ||
"लानती", | ||
"छुतीये", | ||
"चूतिये", | ||
"चूत", | ||
"लौड़ा", | ||
"लौड़े", | ||
"चरित्रहीन", | ||
"लिब्राण्डू", | ||
"नंगी पुंगी", | ||
"पागल औरत", | ||
"बाज़ारू औरत", | ||
"बलात्कार", | ||
"बदसूरत", | ||
"मुजरा", | ||
"जाहिल औरत", | ||
"औरत-ए-जाहिल", | ||
"भोसड़ीwala", | ||
"भोसड़ीवाला", | ||
"चंडाल चौकड़ी", | ||
"म्लेच्छा", | ||
"सूअर", | ||
"सूअर की औलाद", | ||
"दोगली", | ||
"🏹🏹", | ||
"पनौती", | ||
"हरामी", | ||
"गधी", | ||
"बुरखा धत्त", | ||
"बुल्ली", | ||
"कलमुंही", | ||
"पिछवाड़ा", | ||
"काम वाली बाई", | ||
"पैर की जूती", | ||
"नाल", | ||
"गंदी नाली", | ||
"हगना", | ||
"सुल्ली", | ||
"हिज़रापंती", | ||
"नाचने वाली", | ||
"तवाइफ़", | ||
"सौ टका टंच माल", | ||
"किन्नर", | ||
"गद्दार", | ||
"चमचा", | ||
"चमची", | ||
"आतंकवादी", | ||
"मुलिया", | ||
"कटवा", | ||
"चाटुकार", | ||
"बहन की लोड़ी", | ||
"चुस्लिम", | ||
"चुस्लामि", | ||
"चुसल्मान", | ||
"चूस", | ||
"भीमटा", | ||
"भीमटी", | ||
"बैल बुद्धि", | ||
"हलाला", | ||
"भद्दी औरत", | ||
"भांड औरत", | ||
"भाड़े काटट्टू", | ||
"दो कौड़ी की औरत", | ||
"घटिया औरत", | ||
"बेहूदा औरत", | ||
"चालू औरत", | ||
"झूठी औरत", | ||
"मर क्यों नहीं जाती", | ||
"नल्ली", | ||
"भूतनी के", | ||
"चूत के बाल", | ||
"मादरजात", | ||
"भड़वा", | ||
"चूची", | ||
"टट्टी", | ||
"गटर पैदाइश", | ||
"मुँह में ले", | ||
"मूत", | ||
"नाजायज़", | ||
"कटा लुंड", | ||
"काला टेंट", | ||
"जूता खायेगी", | ||
"बुरखे वाली", | ||
"काली कलूटी", | ||
"काले तवे", | ||
"मोटी भैंस", | ||
"देहातन", | ||
"देहाती औरत", | ||
"गणिका", | ||
"हबशी", | ||
"ओला हु उबर" | ||
] |
Oops, something went wrong.