Front/wf date filtering (#305)

## 📝 Description

renderedtext/project-tasks#2405
renderedtext/project-tasks#2402

## ✅ Checklist
- [ ] I have tested this change
- [ ] This change requires documentation update

Author: VeljkoMaksimovic

front/assets/js/people/spinner.js

@@ -1,5 +1,10 @@
 export default function toggleSpinner() {
   const spinner = document.querySelector(".spinner")
+  
+  if (!spinner) {
+    return
+  }
+  
   if(spinner.style.display == "none"){
     spinner.style.display = "block"
   }else{

front/assets/js/workflow_list.js

@@ -1,27 +1,117 @@
-import $ from "jquery";
-
 import { TokenPagination } from "./pollman_list/token_pagination"
 import { PollmanList } from "./pollman_list/list"
+import debounce from "./debounce"
 
 export var WorkflowList = {
+  initiated: false,
+  pagination: null,
+  pollmanList: null,
+  container: null,
+  queryParams: ['page_token', 'direction', 'date_from', 'date_to', 'author'],
+
   init: function() {
     if(this.initiated === true) { return; }
 
     this.initiated = true
-
     this.pagination = new TokenPagination("#workflow-lists")
-
     let pollmanList = new PollmanList;
 
     let updatePollman = function(container, params) {
-      pollmanList.updateOptionsAndFetch(container, params);
-
       const currentUrl = new URL(window.location.href);
-      currentUrl.searchParams.set('page_token', params.page_token);
-      currentUrl.searchParams.set('direction', params.direction);
+      const mergedParams = {};
+      
+      WorkflowList.queryParams.forEach(queryParam => {
+        const currentValue = currentUrl.searchParams.get(queryParam);
+        if (currentValue) {
+          mergedParams[queryParam] = currentValue;
+        }
+      });
+      
+      Object.keys(params).forEach(key => {
+        mergedParams[key] = params[key];
+      });
+      
+      pollmanList.updateOptionsAndFetch(container, mergedParams);
+      
+      WorkflowList.queryParams.forEach(queryParam => {
+        const paramValue = mergedParams[queryParam];
+        if (paramValue && paramValue !== '') {
+          currentUrl.searchParams.set(queryParam, paramValue);
+        } else {
+          currentUrl.searchParams.delete(queryParam);
+        }
+      });
+
       window.history.pushState({}, '', currentUrl.toString());
     }
 
     this.pagination.onUpdate(updatePollman);
+    this.initFilterButtons(updatePollman);
+    this.initializeDateFilterValues();
+  },
+  
+  initFilterButtons: function(updatePollman) {
+    const dateFromInput = document.getElementById('date_from');
+    const dateToInput = document.getElementById('date_to');
+    const authorInput = document.getElementById('author');
+    
+    
+    const applyFilters = () => {
+      const dateFrom = dateFromInput?.value;
+      const dateTo = dateToInput?.value;
+      const author = authorInput?.value;
+      
+      // Validate date range
+      if (dateFrom && dateTo) {
+        const fromDate = new Date(dateFrom);
+        const toDate = new Date(dateTo);
+        
+        if (fromDate > toDate) {
+          alert('Start date must be before end date');
+          return;
+        }
+      }
+      
+      let params = {'page_token': '', 'direction': ''};
+      params.date_from = dateFrom;
+      params.date_to = dateTo;
+      params.author = author;
+      
+      const container = document.querySelector('.pollman-container');
+      updatePollman(container, params);
+    };
+    
+    if (authorInput) {
+      authorInput.addEventListener('input', debounce(applyFilters, 300, false));
+    }
+    if (dateFromInput) {
+      dateFromInput.addEventListener('change', applyFilters);
+    }
+    if (dateToInput) {
+      dateToInput.addEventListener('change', applyFilters);
+    }
+  },
+
+  initializeDateFilterValues: function() {
+    const urlParams = new URLSearchParams(window.location.search);
+    const dateFrom = urlParams.get('date_from');
+    const dateTo = urlParams.get('date_to');
+    const author = urlParams.get('author');
+    
+    const dateFromInput = document.getElementById('date_from');
+    const dateToInput = document.getElementById('date_to');
+    const authorInput = document.getElementById('author');
+    
+    if (dateFrom && dateFromInput) {
+      dateFromInput.value = dateFrom;
+    }
+    
+    if (dateTo && dateToInput) {
+      dateToInput.value = dateTo;
+    }
+    
+    if (author && authorInput) {
+      authorInput.value = author;
+    }
   }
 }

front/lib/front/branch_page/model.ex

@@ -35,6 +35,9 @@ defmodule Front.BranchPage.Model do
       field(:organization_id, String.t())
       field(:page_token, String.t())
       field(:direction, String.t())
+      field(:date_from, String.t())
+      field(:date_to, String.t())
+      field(:author, String.t())
     end
   end
 
@@ -134,24 +137,87 @@ defmodule Front.BranchPage.Model do
   end
 
   defp list_workflows(params) do
-    {wfs, next_page_token, previous_page_token} =
+    api_params =
       [
         page_size: 10,
         page_token: params.page_token,
         project_id: params.project_id,
         branch_name: params.branch_name,
         direction: map_workflow_direction(params.direction)
       ]
+      |> inject_date_filter_param(params.date_from, :date_from)
+      |> inject_date_filter_param(params.date_to, :date_to)
+      |> inject_requesters_param(params.author, params.organization_id, params.project_id)
+
+    {wfs, next_page_token, previous_page_token} =
+      api_params
       |> Models.Workflow.list_keyset()
 
     workflows = Front.Decorators.Workflow.decorate_many(wfs)
 
     {workflows, next_page_token, previous_page_token}
   end
 
+  defp inject_requesters_param(api_params, author, _, _) when author in [nil, ""], do: api_params
+
+  defp inject_requesters_param(api_params, author, org_id, project_id) do
+    case Front.RBAC.Members.list_project_members(org_id, project_id, username: author) do
+      {:ok, {members, _total_pages}} ->
+        case members |> Enum.map(& &1.id) do
+          [] -> api_params
+          user_ids -> Keyword.put(api_params, :requester_ids, user_ids)
+        end
+
+      _ ->
+        api_params
+    end
+  end
+
+  defp inject_date_filter_param(api_params, date, _) when date in [nil, ""], do: api_params
+
+  defp inject_date_filter_param(api_params, date, :date_from),
+    do: Keyword.put(api_params, :created_after, timestamp(:beginning, date))
+
+  defp inject_date_filter_param(api_params, date, :date_to),
+    do: Keyword.put(api_params, :created_before, timestamp(:end, date))
+
+  defp timestamp(_, timestamp) when timestamp in [nil, ""], do: nil
+
+  @date_format "{YYYY}-{0M}-{0D}"
+  defp timestamp(direction, date) do
+    rounding_func =
+      case direction do
+        :beginning -> &Timex.beginning_of_day/1
+        :end -> &Timex.end_of_day/1
+        _ -> nil
+      end
+
+    case Timex.parse(date, @date_format) do
+      {:ok, datetime} ->
+        datetime |> Timex.to_datetime() |> rounding_func.() |> to_google_timestamp()
+
+      {:error, reason} ->
+        Logger.error("Error parsing date: #{inspect(reason)}")
+        nil
+    end
+  end
+
+  defp to_google_timestamp(date) do
+    case Timex.to_unix(date) do
+      {:error, _} -> nil
+      s -> Google.Protobuf.Timestamp.new(seconds: s)
+    end
+  end
+
   defp map_workflow_direction("next"), do: Direction.value(:NEXT)
   defp map_workflow_direction("previous"), do: Direction.value(:PREVIOUS)
   defp map_workflow_direction(_), do: map_workflow_direction("next")
 
-  defp first_page?(params), do: params.page_token == ""
+  defp first_page?(params) do
+    filter_fields = [:page_token, :date_from, :date_to, :author]
+
+    Enum.all?(filter_fields, fn field ->
+      is_nil(Map.get(params, field)) || Map.get(params, field) == ""
+    end)
+  end
 end

front/lib/front/models/user.ex

@@ -327,6 +327,28 @@ defmodule Front.Models.User do
     end)
   end
 
+  def search_users(query, limit \\ 20) do
+    Watchman.benchmark("search_users.duration", fn ->
+      request =
+        InternalApi.User.SearchUsersRequest.new(
+          query: query,
+          limit: limit
+        )
+
+      {:ok, channel} = channel()
+
+      case InternalApi.User.UserService.Stub.search_users(channel, request) do
+        {:ok, response} ->
+          users = Enum.map(response.users, fn user -> construct(user) end)
+          {:ok, users}
+
+        {:error, error} ->
+          Logger.error("[User Model] Error while searching users: #{inspect(error)}")
+          {:error, error}
+      end
+    end)
+  end
+
   defp refresh_repository_provider(user_id, provider) do
     Watchman.benchmark("refresh_repository_provider.duration", fn ->
       alias InternalApi.User.UserService.Stub

front/lib/front_web/controllers/branch_controller.ex

@@ -39,6 +39,9 @@ defmodule FrontWeb.BranchController do
     org_id = conn.assigns.organization_id
     page_token = params["page_token"] || ""
     direction = params["direction"] || ""
+    date_from = params["date_from"] || ""
+    date_to = params["date_to"] || ""
+    author = params["author"] || ""
 
     branch = conn.assigns.branch
     project = conn.assigns.project
@@ -50,7 +53,10 @@ defmodule FrontWeb.BranchController do
         project_id: project.id,
         organization_id: org_id,
         page_token: page_token,
-        direction: direction
+        direction: direction,
+        date_from: date_from,
+        date_to: date_to,
+        author: author
       )
 
     {:ok, model, source} = params |> BranchPage.Model.get()
@@ -60,7 +66,10 @@ defmodule FrontWeb.BranchController do
       href: "/branches/#{branch.id}/workflows",
       params: [
         page_token: page_token,
-        direction: direction
+        direction: direction,
+        date_from: date_from,
+        date_to: date_to,
+        author: author
       ]
     }
 
@@ -89,6 +98,9 @@ defmodule FrontWeb.BranchController do
   def workflows(conn, params) do
     page_token = params["page_token"] || ""
     direction = params["direction"] || ""
+    date_from = params["date_from"] || ""
+    date_to = params["date_to"] || ""
+    author = params["author"] || ""
 
     branch = conn.assigns.branch
     project = conn.assigns.project
@@ -100,7 +112,10 @@ defmodule FrontWeb.BranchController do
         project_id: project.id,
         organization_id: conn.assigns.organization_id,
         page_token: page_token,
-        direction: direction
+        direction: direction,
+        date_from: date_from,
+        date_to: date_to,
+        author: author
       )
 
     {:ok, model, source} = params |> BranchPage.Model.get()
@@ -110,7 +125,10 @@ defmodule FrontWeb.BranchController do
       href: "/branches/#{branch.id}/workflows",
       params: [
         page_token: page_token,
-        direction: direction
+        direction: direction,
+        date_from: date_from,
+        date_to: date_to,
+        author: author
       ]
     }
 

front/lib/front_web/templates/branch/_filters.html.eex

@@ -0,0 +1,12 @@
+<div class="flex-m items-center">
+  <%# <input id="author" name="author" type="text" placeholder="User" class="form-control mb3 mb0-m mr3 w5"> %>
+
+  <div class="flex items-center mr2">
+    <span class="f6 gray mr1">From</span>
+    <input id="date_from" name="date_from" type="date" class="form-control mb3 mb0-m w4">
+  </div>
+  <div class="flex items-center">
+    <span class="f6 gray mr1">To</span>
+    <input id="date_to" name="date_to" type="date" class="form-control mb3 mb0-m w4">
+  </div>
+</div>

front/lib/front_web/templates/branch/guest.html.eex

@@ -24,8 +24,10 @@
 </div>
 
 <div class="bg-washed-gray pa3 br3 ba b--black-075">
-  <div class="f5 mb2">
-    Most recent activity on this <%= branch_type_name(@branch.type) |> String.downcase() %>
+  <div class="flex-m items-center justify-between mb3">
+    <div class="f5 gray mr3 mb3 mb0-m">
+      Most recent activity on this <%= branch_type_name(@branch.type) |> String.downcase() %>
+    </div>
   </div>
   <div id="workflow-lists">
     <%= render FrontWeb.BranchView, "_workflows.html", project: @project, workflows: @workflows, branch: @branch, conn: @conn, page: :branch, pagination: @pagination, pollman: @pollman, conflict_info: @conflict_info %>

front/lib/front_web/templates/branch/member.html.eex

@@ -30,8 +30,13 @@
 </div>
 
 <div class="bg-washed-gray pa3 br3 ba b--black-075">
-  <div class="f5 mb2">
-    Most recent activity on this <%= branch_type_name(@branch.type) |> String.downcase() %>
+  <div class="flex-m items-center justify-between mb3">
+    <div class="f5 gray mr3 mb3 mb0-m">
+      Most recent activity on this <%= branch_type_name(@branch.type) |> String.downcase() %>
+    </div>
+    <%= if FeatureProvider.feature_enabled?(:workflow_filtering, param: @organization.id) do %>
+      <%= render FrontWeb.BranchView, "_filters.html" %>
+    <% end %>
   </div>
   <div id="workflow-lists">
     <%= render FrontWeb.BranchView, "_workflows.html", project: @project, workflows: @workflows, branch: @branch, conn: @conn, page: :branch, pagination: @pagination, pollman: @pollman, conflict_info: @conflict_info %>