https://github.com/aralroca/react-text-toxicity

Detect text toxicity in a simple way, using React. Based in a Keras model, loaded with Tensorflow.js.
https://github.com/aralroca/react-text-toxicity

javascript machine-learning preact react tensorflow text toxicity

Last synced: about 2 months ago
JSON representation

Detect text toxicity in a simple way, using React. Based in a Keras model, loaded with Tensorflow.js.

• Host: GitHub
• URL: https://github.com/aralroca/react-text-toxicity
• Owner: aralroca
• License: other
• Created: 2020-04-28T10:04:17.000Z (about 5 years ago)
• Default Branch: master
• Last Pushed: 2023-01-06T04:32:05.000Z (over 2 years ago)
• Last Synced: 2025-03-29T06:43:20.847Z (3 months ago)
• Topics: javascript, machine-learning, preact, react, tensorflow, text, toxicity
• Language: JavaScript
• Size: 1.83 MB
• Stars: 44
• Watchers: 2
• Forks: 5
• Open Issues: 13
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
## React Text Toxicity

Detect toxicity in text using React.

It's based on this model: https://github.com/tensorflow/tfjs-models/tree/master/toxicity

## Getting started

```

yarn add react-text-toxicity

```

Import as:

```js

import useTextToxicity from "react-text-toxicity";

```

Use it as:

```js

const predictions = useTextToxicity('text', { threshold, delay });

```

* **text** - Text to predict

* **options**

  * **threshold** Prediction threshold *(0.9 as default)*

  * **delay** Delay in milliseconds applied to debounce multiple changes *(300ms as default)*

## Example

![example](./example/toxicity.gif)

```jsx

import React, { Fragment, useState } from "react";

import useTextToxicity from "react-text-toxicity";

function Toxicity({ predictions }) {

  const style = { margin: 10 };

  if (!predictions) return 
Loading predictions...
;


  return (

    


      {predictions.map(({ label, match, probability }) => (

        


          {`${label} - ${probability} - ${match ? "🤢" : "🥰"}`}

        

      ))}

    

  );

}


export default function Index() {

  const [value, setValue] = useState("");

  const predictions = useTextToxicity(value);

  return (

    


      


        
Write something

         setValue(e.target.value)}

        />

      

      {value && }

    

  );

}

```