Remove watchers 🧹

README.md

@@ -85,7 +85,6 @@ Cherry App (Ruby on Rails):
 
 And here's a list of tasks that are great for first-time contributors:
 
-- Remove the "watch" feature from metrics as this is not generally used
 - Address TODO comments in the codebase
 
 ## Any further question or suggestion?

app/controllers/api/contributions_controller.rb

@@ -22,8 +22,6 @@ def create # rubocop:disable Metrics/MethodLength, Metrics/AbcSize
             commit_date: params[:commit_date],
             diff: contribution_params.require('diff')
           )
-
-          contribution.notify_watchers!
         end
     end
 

app/javascript/components/Breadcrumb.tsx

@@ -1,6 +1,5 @@
-import { Avatar, Breadcrumb as BaseBreadcrumb, Button, Dropdown, Tooltip } from 'flowbite-react'
+import { Avatar, Breadcrumb as BaseBreadcrumb, Tooltip } from 'flowbite-react'
 import { useNavigate, useSearchParams } from 'react-router-dom'
-import { useMetricWatchersCreate, useMetricWatchersDestroy } from '../queries/user/metricWatchers'
 
 import _ from 'lodash'
 import useCurrentUser from '../hooks/useCurrentUser'
@@ -15,8 +14,6 @@ import ProjectActionsMenu from './ProjectActionsMenu'
 const Breadcrumb = ({ projects, metrics }: { projects: Project[]; metrics: Metric[] }) => {
   const [searchParams] = useSearchParams()
   const navigate = useNavigate()
-  const { mutate: watchMetric } = useMetricWatchersCreate()
-  const { mutate: unwatchMetric } = useMetricWatchersDestroy()
   const user = useCurrentUser()
 
   const projectId = searchParams.get('project_id')
@@ -29,10 +26,7 @@ const Breadcrumb = ({ projects, metrics }: { projects: Project[]; metrics: Metri
   const viewerIds = views ? _.uniq(views.map((view) => view.user_id)) : []
   const { data: viewers } = useUsersIndex({ ids: viewerIds, enabled: !!currentMetric })
 
-  const { data: watchers } = useUsersIndex({ ids: currentMetric?.watcher_ids, enabled: !!currentMetric })
-
   if (!user) return null
-  const isWatching = currentMetric && currentMetric.watcher_ids.includes(user.id)
 
   return (
     <div className="card mb-3 flex flex-col md:flex-row md:items-center gap-3">
@@ -58,40 +52,6 @@ const Breadcrumb = ({ projects, metrics }: { projects: Project[]; metrics: Metri
         )}
       </BaseBreadcrumb>
 
-      {currentMetric && metricId && (
-        <div className="flex gap-3 items-center">
-          {isWatching ? (
-            <Dropdown size="sm" label="Watching">
-              <Dropdown.Item onClick={() => unwatchMetric({ metricId })}>Unwatch</Dropdown.Item>
-            </Dropdown>
-          ) : (
-            <Tooltip placement="right" content="By watching you'll be alerted about new contributions to this metric.">
-              <Button size="sm" onClick={() => watchMetric({ metricId })}>
-                Watch
-              </Button>
-            </Tooltip>
-          )}
-          {watchers && (
-            <>
-              <Avatar.Group>
-                {watchers.map((watcher) => (
-                  <Tooltip key={watcher.id} content={watcher.name} arrow={false}>
-                    <Avatar
-                      img={watcher.image}
-                      rounded
-                      stacked
-                      className="cursor-pointer"
-                      onClick={() => navigate(`/user/users/${watcher.id}`)}
-                    />
-                  </Tooltip>
-                ))}
-              </Avatar.Group>
-              {watchers.length} {watchers.length > 1 ? 'watchers' : 'watcher'}
-            </>
-          )}
-        </div>
-      )}
-
       {currentProject && (
         <div className="ml-auto flex items-center gap-3">
           {!currentMetric && <ProjectActionsMenu projectId={currentProject.id} />}

app/javascript/components/Navbar.tsx

@@ -1,15 +1,16 @@
+import { Avatar, Button, Dropdown, Navbar } from 'flowbite-react'
+import CommandPalette, { CommandPaletteButton } from './CommandPalette'
+
+import { LinearProgress } from '@mui/material'
+import { Link } from 'react-router-dom'
 // import AddCircleOutlineIcon from '@mui/icons-material/AddCircleOutline'
 import LogoutIcon from '@mui/icons-material/Logout'
 import NotificationsIcon from '@mui/icons-material/Notifications'
 import SettingsIcon from '@mui/icons-material/Settings'
-import { LinearProgress } from '@mui/material'
 import { useIsFetching } from '@tanstack/react-query'
-import { Avatar, Button, Dropdown, Navbar } from 'flowbite-react'
 import { useNavigate } from 'react-router'
-import { Link } from 'react-router-dom'
 import useCurrentUser from '../hooks/useCurrentUser'
 import { useNotificationsIndex } from '../queries/user/notifications'
-import CommandPalette, { CommandPaletteButton } from './CommandPalette'
 
 const CherryNavbar = () => {
   const user = useCurrentUser()

app/javascript/components/NotificationsPage.tsx

@@ -1,13 +1,14 @@
 import { Button, Card } from 'flowbite-react'
-import { useNavigate } from 'react-router-dom'
 import { buildCommitUrl, formatDiff, timeAgoInWords } from '../helpers/applicationHelper'
-import { useMetricsIndex } from '../queries/user/metrics'
 import {
   useNotificationsIndex,
   useNotificationsMarkAllAsSeen,
   useNotificationsMarkAsSeen,
 } from '../queries/user/notifications'
 
+import { useNavigate } from 'react-router-dom'
+import { useMetricsIndex } from '../queries/user/metrics'
+
 const NotificationsPage = () => {
   const { data, fetchNextPage, hasNextPage } = useNotificationsIndex()
   const notifications = data?.pages.flat()
@@ -20,12 +21,9 @@ const NotificationsPage = () => {
 
   return (
     <div className="container">
-      <div className="md:flex items-center justify-between">
-        <div>
-          <h1>Notifications</h1>
-          <p className="mb-3">To be notified about contributions to a metric, go to its page and watch for changes.</p>
-        </div>
-        <Button className="mb-3 md:mb-0" onClick={() => markAllAsSeen()}>
+      <div className="md:flex md:flex-row flex-col gap-6 items-center justify-between mb-6">
+        <h1>Notifications</h1>
+        <Button className="md:mb-0" onClick={() => markAllAsSeen()}>
           Mark all as seen
         </Button>
       </div>

app/javascript/queries/user/contributions.ts

@@ -17,7 +17,6 @@ export interface Contribution {
     project_id: number
     created_at: string
     updated_at: string
-    watcher_ids: number[]
     project: {
       id: number
       name: string

app/javascript/queries/user/metrics.ts

@@ -1,4 +1,5 @@
 import { useMutation, useQuery, useQueryClient } from '@tanstack/react-query'
+
 import axios from 'axios'
 import { Project } from './projects'
 
@@ -8,7 +9,6 @@ export interface Metric {
   project_id: number
   updated_at: string
   created_at: string
-  watcher_ids: number[]
 }
 
 type MetricIndexReponse = (Metric & { project: Project })[]

app/models/contribution.rb

@@ -9,11 +9,4 @@ class Contribution < ApplicationRecord
   validates :author_email, presence: true
   validates :diff, presence: true
   validates :diff, numericality: { only_integer: true }
-
-  def notify_watchers!
-    return if metric.watcher_ids.empty?
-
-    users = User.where(id: metric.watcher_ids)
-    users.each { |user| Notification.create(user_id: user.id, item_id: id, item_type: self.class) }
-  end
 end

app/models/notification.rb

@@ -20,15 +20,6 @@ def message
     end
   end
 
-  def unsubscribe_text
-    case item
-    when Contribution
-      'Unwatch this metric'
-    else
-      raise "Unknown notification item type: #{item.class}"
-    end
-  end
-
   def unsubscribe_url
     case item
     when Contribution

app/views/pages/home.html.erb

@@ -57,14 +57,6 @@
          alt: 'screenshot of the autocomplete selector for filtering owners'
 %>
 
-<%=
-  render 'feature_section',
-         title: 'Get alerted about critical changes 🚨',
-         text: 'Watch important metrics to receive live notifications. Every contribution counts.',
-         image: 'ss_notifications.webp',
-         alt: 'screenshot of the notifications page with sample unread notifications'
-%>
-
 <section class="rounded-xl bg-slate-100 mb-12 p-6 md:p-12 dark:bg-slate-800 border-dashed border-4">
   <%= render 'components/pricing' %>
 </section>

app/views/user_mailer/daily_notifications_report.erb

@@ -8,7 +8,6 @@
   <% @notifications.each do |notification| %>
     <li>
       <%= notification.message %>
-      <%= link_to notification.unsubscribe_text, notification.unsubscribe_url, style: 'font-size:12px;' %>
     </li>
   <% end %>
 </p>

app/views/user_mailer/weekly_report.html.erb

@@ -34,8 +34,3 @@
 <% end %>
 
 <p>Hope you're in a good trend!<br /><a href="https://twitter.com/fwuensche">@fwuensche</a></p>
-
-<p>
-  PS: To receive daily notifications on specific metrics, just go to one of the links above and click the "Watch"
-  button. ✨
-</p>

config/routes.rb

@@ -31,7 +31,6 @@
       nested_resources :metrics, only: %i[index show destroy] do
         resources :occurrences, only: %i[index]
       end
-      resource :metric_watchers, only: %i[create destroy]
       resources :notifications, only: %i[index] do
         put 'mark_as_seen', on: :member
         put 'mark_all_as_seen', on: :collection

db/migrate/20240910214443_remove_watcher_ids_from_metrics.rb

@@ -0,0 +1,7 @@
+# frozen_string_literal: true
+
+class RemoveWatcherIdsFromMetrics < ActiveRecord::Migration[7.1]
+  def change
+    remove_column :metrics, :watcher_ids, :integer, array: true, default: []
+  end
+end

public/articles/the-one-commit-against-technical-debt.md

@@ -88,7 +88,6 @@ Here's a non-exhaustive list of things that you might want to do next:
 - Backfill your project data with historic data (<- write an article and link it here)
 - Create your first dashboard (<- write an article and link it here)
 - Recognize your Top Contributors 🏆 (<- write an article and link it here)
-- Watch changes to critical metrics (<- write an article and link it here)
 - Block PRs introducing new violations (<- write an article and link it here)
 - Activate plugins such as rubocop or eslint (<- write an article and link it here)
 - Create custom integrations via the Cherry API (<- write an article and link it here)

test/controllers/api/contributions_controller_test.rb

@@ -35,14 +35,6 @@ class Api::ContributionsControllerTest < ActionDispatch::IntegrationTest
                                    as: :json)
       assert_equal [-30, +33], Contribution.all.map(&:diff).sort
     end
-
-    it 'notifies watchers' do
-      js_loc.update!(watcher_ids: [user.id])
-      post(api_contributions_path, params: { api_key: user.api_key, **payload }, as: :json)
-      assert_equal 1, Notification.count
-      assert_equal user.id, Notification.last.user_id
-      assert_equal js_loc.contributions.sole, Notification.last.item
-    end
   end
 
   private

test/system/metrics_test.rb

@@ -106,21 +106,6 @@ class MetricsTest < ApplicationSystemTestCase
     assert_text '+36'
   end
 
-  it 'allows users to follow and unfollow metrics' do
-    sign_in(user, to: user_projects_path)
-    find('tr', text: 'rails/rails').click
-    assert_text 'eslint'
-    fill_in 'Filter metrics', with: 'rubo'
-    assert_no_text 'eslint'
-    find('tr', text: 'rubocop').click
-    click_on 'Watch'
-    assert_text "You're now watching this metric"
-    assert_text '1 watcher'
-    click_on 'Watching'
-    find('li', text: 'Unwatch').click
-    assert_text "You're no longer watching this metric"
-  end
-
   it 'deletes metrics' do
     sign_in(user, to: user_projects_path)
     visit "/user/projects?project_id=#{project.id}&metric_id=#{eslint_metric.id}"