fix(circleci): big refactor and cleanup

plugins/circleci/README.md

@@ -4,8 +4,6 @@ Website: [https://circleci.com/](https://circleci.com/)
 
 <img src="./src/assets/screenshot-1.png" />
 <img src="./src/assets/screenshot-2.png" />
-<img src="./src/assets/screenshot-3.png" />
-<img src="./src/assets/screenshot-4.png" />
 
 ## Setup
 
@@ -35,8 +33,39 @@ export default builder.build() as ApiHolder;
 export { plugin as Circleci } from '@backstage/plugin-circleci';
 ```
 
-3. Run app with `yarn start` and navigate to `/circleci/settings`
-4. Enter project settings and **project** token, acquired according to [https://circleci.com/docs/2.0/managing-api-tokens/](https://circleci.com/docs/2.0/managing-api-tokens/)
+3. Register the plugin router:
+
+```jsx
+// packages/app/src/components/catalog/EntityPage.tsx
+
+import { Router as CircleCIRouter } from '@backstage/plugin-circleci';
+
+// Then somewhere inside <EntityPageLayout>
+<EntityPageLayout.Content
+  path="/ci-cd/*"
+  title="CI/CD"
+  element={<CircleCIRouter />}
+/>;
+```
+
+4. Add proxy config:
+
+```
+// app-config.yaml
+proxy:
+  '/circleci/api':
+    target: https://circleci.com/api/v1.1
+    changeOrigin: true
+    pathRewrite:
+      '^/proxy/circleci/api/': '/'
+    headers:
+      Circle-Token:
+        $secret:
+          env: CIRCLECI_AUTH_TOKEN
+```
+
+5. Get and provide `CIRCLECI_AUTH_TOKEN` as env variable (https://circleci.com/docs/api/#add-an-api-token)
+6. Add `circleci.com/project-slug` annotation to your component-info.yaml file in format <git-provider>/<owner>/<project> (https://backstage.io/docs/architecture-decisions/adrs-adr002#format)
 
 ## Features
 
@@ -50,3 +79,4 @@ export { plugin as Circleci } from '@backstage/plugin-circleci';
 ## Limitations
 
 - CircleCI has pretty strict rate limits per token, be careful with opened tabs
+- CircelCI doesn't provide a way to auth by 3rd party (e.g. GitHub) token, nor by calling their OAuth endpoints, which currently stands in the way of better auth integration with Backstage (https://discuss.circleci.com/t/circleci-api-authorization-with-github-token/5356)