🕵️ Logical Fallacy Detector

setText(e.target.value)}\n        placeholder=\"Enter text to analyze for logical fallacies...\"\n        rows={6}\n      />\n      <button \n        onClick={detectFallacies} \n        disabled={isLoading}\n      >\n        {isLoading ? 'Analyzing...' : 'Detect Fallacies'}\n      </button>\n\n      {error && (\n        <div className=\"error-message\">\n          {error}\n        </div>\n      )}\n\n      {analysis && (\n        <div className=\"analysis-results\">\n          <h2>\n            {analysis.length === 0 \n              ? '✅ No logical fallacies detected!' \n              : '⚠️ Fallacies Found:'}\n          </h2>\n          {analysis.map((fallacy, index) => (\n            <div key={index} className=\"fallacy-result\">\n              <h3>{fallacy.type}</h3>\n              <p><strong>Problematic Text:</strong> \"{fallacy.text}\"</p>\n              <p><strong>Explanation:</strong> {fallacy.explanation}</p>\n            </div>\n          ))}\n        </div>\n      )}\n\n      <div className=\"fallacy-types\">\n        <h3>Common Logical Fallacies</h3>\n        <ul>\n          {FALLACY_TYPES.map((fallacy, index) => (\n            <li key={index}>\n              <strong>{fallacy.name}</strong>: {fallacy.description}\n            </li>\n          ))}\n        </ul>\n      </div>\n\n      <a \n        href={import.meta.url.replace(\"esm.town\", \"val.town\")} \n        target=\"_top\" \n        className=\"source-link\"\n      >\n        View Source\n      </a>\n    </div>\n  );\n}\n\nfunction client() {\n  createRoot(document.getElementById(\"root\")).render(<FallacyDetector />);\n}\nif (typeof document !== \"undefined\") { client(); }\n\nexport default async function server(request: Request): Promise<Response> {\n  return new Response(`\n    <html>\n      <head>\n        <title>Logical Fallacy Detector</title>\n        <style>${css}</style>\n      </head>\n      <body>\n        <div id=\"root\"></div>\n        <script src=\"https://esm.town/v/std/catch\"></script>\n        <script type=\"module\" src=\"${import.meta.url}\"></script>\n      </body>\n    </html>\n  `, {\n    headers: { \"content-type\": \"text/html\" }\n  });\n}\n\nconst css = `\nbody {\n  font-family: system-ui, sans-serif;\n  background-color: #f4f4f4;\n  margin: 0;\n  padding: 20px;\n  display: flex;\n  justify-content: center;\n}\n\n.fallacy-detector {\n  max-width: 800px;\n  width: 100%;\n  background-color: white;\n  border-radius: 10px;\n  box-shadow: 0 4px 6px rgba(0,0,0,0.1);\n  padding: 20px;\n}\n\ntextarea {\n  width: 100%;\n  margin-bottom: 15px;\n  padding: 10px;\n  border: 1px solid #ddd;\n  border-radius: 5px;\n  resize: vertical;\n}\n\nbutton {\n  width: 100%;\n  padding: 10px;\n  background-color: #3498db;\n  color: white;\n  border: none;\n  border-radius: 5px;\n  cursor: pointer;\n  transition: background-color 0.3s ease;\n}\n\nbutton:hover {\n  background-color: #2980b9;\n}\n\nbutton:disabled {\n  background-color: #bdc3c7;\n  cursor: not-allowed;\n}\n\n.error-message {\n  color: red;\n  margin: 10px 0;\n  text-align: center;\n}\n\n.analysis-results {\n  margin-top: 20px;\n  padding: 15px;\n  background-color: #f9f9f9;\n  border-radius: 5px;\n}\n\n.fallacy-result {\n  margin-bottom: 15px;\n  padding: 10px;\n  background-color: #fff3cd;\n  border-radius: 5px;\n}\n\n.fallacy-types {\n  margin-top: 20px;\n  background-color: #f1f8ff;\n  padding: 15px;\n  border-radius: 5px;\n}\n\n.fallacy-types ul {\n  padding-left: 20px;\n}\n\n.source-link {\n  display: block;\n  text-align: center;\n  margin-top: 20px;\n  color: #666;\n  text-decoration: none;\n}\n`;","deleted","label",[98],"permalink","https://www.val.town/x/davincidreams/fallacyDetectorAI/code/main.tsx","extension","actionData","errors"]
</article></body></html>