Merge branch 'main' into fix-checkly-readme

.github/workflows/auto-resolve-keep.yml

@@ -61,7 +61,7 @@ jobs:
           url: "https://api.keephq.dev/incidents/${{ steps.set_ids.outputs.final_incident_id }}/enrich"
           method: "POST"
           customHeaders: '{"X-API-KEY": "${{ secrets.KEEP_API_KEY }}", "Content-Type": "application/json"}'
-          data: '{"enrichments":{"incident_title":"${{ github.event.pull_request.title || ''Manual resolution'' }}","incident_url":"${{ github.event.pull_request.html_url || github.server_url }}//${{ github.repository }}/actions/runs/${{ github.run_id }}", "incident_id": "${{ github.run_id }}", "incident_provider": "github"}}'
+          data: '{"enrichments":{"incident_title":"${{ github.event.pull_request.title || ''Manual resolution'' }}","incident_url":"${{ github.event.pull_request.html_url || format(''{0}/{1}/actions/runs/{2}'', github.server_url, github.repository, github.run_id) }}", "incident_id": "${{ github.run_id }}", "incident_provider": "github"}}'
 
       - name: Auto resolve Keep alert
         if: |
@@ -72,4 +72,4 @@ jobs:
           url: "https://api.keephq.dev/alerts/enrich?dispose_on_new_alert=true"
           method: "POST"
           customHeaders: '{"Content-Type": "application/json", "X-API-KEY": "${{ secrets.KEEP_API_KEY }}"}'
-          data: '{"enrichments":{"status":"${{ inputs.status || ''resolved'' }}","dismissed":false,"dismissUntil":"","note":"${{ github.event.pull_request.title || ''Manual resolution'' }}","ticket_url":"${{ github.event.pull_request.html_url || github.server_url }}//${{ github.repository }}/actions/runs/${{ github.run_id }}"},"fingerprint":"${{ steps.set_ids.outputs.final_alert_fingerprint }}"}'
+          data: '{"enrichments":{"status":"${{ inputs.status || ''resolved'' }}","dismissed":false,"dismissUntil":"","note":"${{ github.event.pull_request.title || ''Manual resolution'' }}","ticket_url":"${{ github.event.pull_request.html_url || format(''{0}/{1}/actions/runs/{2}'', github.server_url, github.repository, github.run_id) }}"},"fingerprint":"${{ steps.set_ids.outputs.final_alert_fingerprint }}"}'

README.md

@@ -110,6 +110,12 @@
             Cilium
         </a>
     </td>
+    <td align="center" width="150">
+        <a href="https://docs.keephq.dev/providers/documentation/checkly-provider" target="_blank">
+            <img width="40" src="keep-ui/public/icons/checkly-icon.png" alt="Checkly"/><br/>
+            Checkly
+        </a>
+    </td>
     <td align="center" width="150">
         <a href="https://docs.keephq.dev/providers/documentation/cloudwatch-provider" target="_blank">
             <img width="40" src="keep-ui/public/icons/cloudwatch-icon.png" alt="CloudWatch"/><br/>

docs/mint.json

@@ -137,6 +137,7 @@
             "providers/documentation/bigquery-provider",
             "providers/documentation/centreon-provider",
             "providers/documentation/checkmk-provider",
+            "providers/documentation/checkly-provider",
             "providers/documentation/cilium-provider",
             "providers/documentation/clickhouse-provider",
             "providers/documentation/cloudwatch-provider",

docs/providers/documentation/checkly-provider.mdx

@@ -0,0 +1,124 @@
+---
+title: 'Checkly'
+sidebarTitle: 'Checkly Provider'
+description: 'StatusCake allows you to receive alerts from Checkly using API endpoints as well as webhooks'
+---
+
+## Authentication Parameters
+
+The Checkly provider offers two ways to authenticate:
+
+- `Checkly API Key` - This is the API key created in the User Settings of your Checkly account and is used to authenticate requests to the Checkly API.
+- `Checkly Account ID` - This is the account ID of your Checkly account.
+
+## Connecting Checkly to Keep
+
+1. Open Checkly dashboard and click on your profile picture in the top right corner.
+
+2. Click on `User Settings`.
+
+<Frame width="100" height="200">
+  <img height="10" src="/images/checkly-provider_1.png" />
+</Frame>
+
+3. Open the `API Keys` tab and click on `Create API Key` to generate a new API key.
+
+<Frame width="100" height="200">
+  <img height="10" src="/images/checkly-provider_2.png" />
+</Frame>
+
+4. Copy the API key.
+
+5. Open `General` tab under Account Settings and copy the `Account ID`.
+
+<Frame width="100" height="200">
+  <img height="10" src="/images/checkly-provider_3.png" />
+</Frame>
+
+6. Go to Keep, add Checkly as a provider and enter the API key and Account ID in the respective fields and click on `Connect`.
+
+## Webhooks Integration
+
+1. Open Checkly dashboard and open `Alerts` tab in the left sidebar.
+
+<Frame width="100" height="200">
+  <img height="10" src="/images/checkly-provider_4.png" />
+</Frame>
+
+2. Click on `Add more channels`
+
+<Frame width="100" height="200">
+  <img height="10" src="/images/checkly-provider_5.png" />
+</Frame>
+
+3. Select `Webhook` from the list of available channels.
+
+<Frame width="100" height="200">
+  <img height="10" src="/images/checkly-provider_6.png" />
+</Frame>
+
+4. Enter a name for the webhook, select the method as `POST`
+
+5. Enter [https://api.keephq.dev/alerts/event/checkly](https://api.keephq.dev/alerts/event/checkly) as the URL.
+
+6. Copy the below snippet and paste in the `Body` of Webhook. Refer the screenshot below for reference.
+
+```json
+{
+  "event": "{{ALERT_TITLE}}",
+  "alert_type": "{{ALERT_TYPE}}",
+  "check_name": "{{CHECK_NAME}}",
+  "group_name": "{{GROUP_NAME}}",
+  "check_id": "{{CHECK_ID}}",
+  "check_type": "{{CHECK_TYPE}}",
+  "check_result_id": "{{CHECK_RESULT_ID}}",
+  "check_error_message": "{{CHECK_ERROR_MESSAGE}}",
+  "response_time": "{{RESPONSE_TIME}}",
+  "api_check_response_status_code": "{{API_CHECK_RESPONSE_STATUS_CODE}}",
+  "api_check_response_status_text": "{{API_CHECK_RESPONSE_STATUS_TEXT}}",
+  "run_location": "{{RUN_LOCATION}}",
+  "ssl_days_remaining": "{{SSL_DAYS_REMAINING}}",
+  "ssl_check_domain": "{{SSL_CHECK_DOMAIN}}",
+  "started_at": "{{STARTED_AT}}",
+  "tags": "{{TAGS}}",
+  "link": "{{RESULT_LINK}}",
+  "region": "{{REGION}}",
+  "uuid": "{{$UUID}}"
+}
+```
+
+<Frame width="100" height="200">
+  <img height="10" src="/images/checkly-provider_7.png" />
+</Frame>
+
+8. Go to Headers tab and add a new header with key as `X-API-KEY` and create a new API key in Keep and paste it as the value and save the webhook.
+
+<Frame width="100" height="200">
+  <img height="10" src="/images/checkly-provider_8.png" />
+</Frame>
+
+9. Follow the below steps to create a new API key in Keep.
+
+7. Go to Keep dashboard and click on the profile icon in the botton left corner and click `Settings`.
+
+<Frame width="100" height="200">
+  <img height="10" src="/images/checkly-provider_9.png" />
+</Frame>
+
+8. Select `Users and Access` tab and then select `API Keys` tab and create a new API key.
+
+<Frame width="100" height="200">
+  <img height="10" src="/images/checkly-provider_10.png" />
+</Frame>
+
+9. Give name and select the role as `webhook` and click on `Create API Key`.
+
+<Frame width="100" height="200">
+  <img height="10" src="/images/checkly-provider_11.png" />
+</Frame>
+
+10. Use the generated API key in the `X-API-KEY` header of the webhook created in Checkly.
+
+## Useful Links
+
+- [Checkly Website](https://www.checklyhq.com/)

docs/providers/overview.mdx

@@ -84,6 +84,12 @@ By leveraging Keep Providers, users are able to deeply integrate Keep with the t
   icon={ <img src="https://img.logo.dev/checkmk.com?token=pk_dfXfZBoKQMGDTIgqu7LvYg" /> }
 ></Card>
 
+<Card
+  title="Checkly"
+  href="/providers/documentation/checkly-provider"
+  icon={ <img src="https://img.logo.dev/checkly.com?token=pk_dfXfZBoKQMGDTIgqu7LvYg" /> }
+></Card>
+
 <Card
   title="Cilium"
   href="/providers/documentation/cilium-provider"

keep-ui/app/(keep)/incidents/[id]/chat/incident-chat.tsx

@@ -568,8 +568,7 @@ export function IncidentChat({
     return (
       <EmptyStateCard
         title="Chat not available"
-        description="No alerts found for this incident. Go to the alerts feed and assign alerts to interact with the incident."
-        buttonText="Assign alerts to this incident"
+        description="Incident assitant will become available as alerts are assigned to this incident."
         onClick={() => router.push("/alerts/feed")}
       />
     );

keep-ui/app/(keep)/incidents/[id]/incident-layout-client.tsx

@@ -44,7 +44,7 @@ export function IncidentLayoutClient({
               />
             </div>
           }
-          initialLeftWidth={60}
+          initialLeftWidth={65}
         />
       ) : (
         <div className="flex-1 min-w-0">{children}</div>

keep-ui/app/(keep)/incidents/[id]/timeline/incident-timeline.tsx

@@ -283,9 +283,9 @@ export default function IncidentTimeline({
 
   // TODO: Load data on server side
   // Loading state is true if the data is not loaded and there is no error for smoother loading state on initial load
-  const alertsLoading = _alertsLoading || (!alerts && !alertsError);
-  const auditEventsLoading =
-    _auditEventsLoading || (!auditEvents && !auditEventsError);
+  // const alertsLoading = _alertsLoading || (!alerts && !alertsError);
+  // const auditEventsLoading =
+  //   _auditEventsLoading || (!auditEvents && !auditEventsError);
 
   const [selectedEvent, setSelectedEvent] = useState<AuditEvent | null>(null);
 
@@ -358,7 +358,7 @@ export default function IncidentTimeline({
     return {};
   }, [auditEvents, alerts]);
 
-  if (auditEventsLoading || alertsLoading) {
+  if (_auditEventsLoading || _alertsLoading) {
     return (
       <Card>
         <Loading />

keep-ui/components/ui/EmptyStateCard.tsx

@@ -10,7 +10,7 @@ export function EmptyStateCard({
 }: {
   title: string;
   description: string;
-  buttonText: string;
+  buttonText?: string;
   onClick: (e: React.MouseEvent) => void;
   className?: string;
 }) {
@@ -29,9 +29,11 @@ export function EmptyStateCard({
         <p className="text-tremor-default text-tremor-content dark:text-dark-tremor-content">
           {description}
         </p>
-        <Button className="mt-4" color="orange" onClick={onClick}>
-          {buttonText}
-        </Button>
+        {buttonText && (
+          <Button className="mt-4" color="orange" onClick={onClick}>
+            {buttonText}
+          </Button>
+        )}
       </div>
     </Card>
   );

keep-ui/components/ui/ResizableColumns.tsx

@@ -62,7 +62,7 @@ const ResizableColumns = ({
         onMouseDown={startDragging}
       />
 
-      <div className="flex-1 bg-white p-4 overflow-auto">{rightChild}</div>
+      <div className="flex-1 p-4 overflow-auto">{rightChild}</div>
     </div>
   );
 };

keep/providers/checkly_provider/alerts_mock.py

@@ -0,0 +1,21 @@
+ALERTS = {
+  "event": "API Check #1 has recovered",
+  "alert_type": "ALERT_RECOVERY",
+  "check_name": "API Check #1",
+  "group_name": "",
+  "check_id": "927a2982-1007-4b81-b383-eae8bf717e61",
+  "check_type": "API",
+  "check_result_id": "a34867c0-9239-421f-92f2-4408bbd05417",
+  "check_error_message": "",
+  "response_time": "258",
+  "api_check_response_status_code": "200",
+  "api_check_response_status_text": "OK",
+  "run_location": "Singapore",
+  "ssl_days_remaining": "",
+  "ssl_check_domain": "",
+  "started_at": "2025-01-26T11:19:40.544Z",
+  "tags": "",
+  "link": "https://app.checklyhq.com/checks/927a2982-1007-4b81-b383-eae8bf717e61/check-sessions/478cacb1-c40f-4675-89d7-a4e3ecaafb7b",
+  "region": "",
+  "uuid": "4583208e-0bca-48c6-8dc8-d14faf6102b3"
+}