feat: add docs

src/components/api/ApiKey.tsx

@@ -109,10 +109,13 @@ const ApiKeyManager = () => {
   return (
     <Container sx={{ alignSelf: 'flex-start' }}>
       <Typography variant="body2" sx={{ marginTop: '10px' }}>
-        View and test your API endpoints
+        Start by creating an API key below. Then,
         <a href={`${apiUrl}/api-docs/`} target="_blank" rel="noopener noreferrer" style={{ textDecoration: 'none', marginLeft: '5px' }}>
-          here
+         test your API
         </a>
+        or read the <a href={`${apiUrl}/api-docs/`} target="_blank" rel="noopener noreferrer" style={{ textDecoration: 'none', marginLeft: '5px' }}>
+         API documentation
+        </a> for setup instructions.
       </Typography>
       <Typography variant="h6" gutterBottom component="div" style={{ marginBottom: '20px' }}>
         {t('apikey.title')}