Merge branch 'release/0.3.1'

.eslintrc

@@ -85,18 +85,22 @@
       "react/prop-types": 0,
       "react/jsx-key": 0,
       "import/order": ["error", {
-        "groups": ["external", "builtin", "internal", "sibling", "parent", "index"],
+        "newlines-between": "always",
+        "alphabetize": { "order": "asc", "caseInsensitive": true },
+        "warnOnUnassignedImports": true,
+        "groups": ["builtin", "external", "internal", "sibling", "parent", "index", "object", "type"],
         "pathGroups": [
-          { "pattern": "prop-types", "group": "external", "position": "before"},
-          { "pattern": "react-*", "group": "external", "position": "before"},
-          { "pattern": "react", "group": "external", "position": "before"},
-          { "pattern": "components", "group": "internal" },
-          { "pattern": "assets/**", "group": "internal", "position": "after" },
-          { "pattern": "apis", "group": "internal", "position": "after" },
-          { "pattern": "common", "group": "internal", "position": "after" }
+          { "pattern": "react", "group": "builtin", "position": "before" },
+          { "pattern": "common/**", "group": "internal" },
+          { "pattern": "context/**", "group": "internal" },
+          { "pattern": "components/**", "group": "internal" },
+          { "pattern": "assets/**", "group": "internal" },
+          { "pattern": "apis/**", "group": "internal" },
+          { "pattern": "constants/**", "group": "internal", "position": "after" },
+          { "pattern": "utils/**", "group": "internal" },
+          { "pattern": "helpers/**", "group": "internal" }
         ],
-        "pathGroupsExcludedImportTypes": ["builtin"],
-        "alphabetize": { "order": "asc", "caseInsensitive": true }
+        "pathGroupsExcludedImportTypes": ["builtin"]
       }]
     }
   }

.slugignore

@@ -0,0 +1,2 @@
+/spec
+/test

app/assets/config/manifest.js

@@ -2,3 +2,4 @@
 //= link_directory ../stylesheets .css
 //= link_tree ../../javascript .js
 //= link_tree ../../../vendor/javascript .js
+//= link_tree ../js .js

app/controllers/internal_api/v1/projects_controller.rb

@@ -28,7 +28,7 @@ def update
 
   def destroy
     authorize project
-    project.discard!
+    render json: { notice: I18n.t("projects.delete.success.message") }, status: :ok if project.discard!
   end
 
   private

app/controllers/invoices/view_controller.rb

@@ -5,6 +5,8 @@ class Invoices::ViewController < ApplicationController
   skip_after_action :verify_authorized
 
   def show
+    invoice.viewed! if invoice.sent?
+
     render :show, locals: { invoice: }, layout: false
   end
 

app/helpers/application_helper.rb

@@ -3,7 +3,7 @@
 module ApplicationHelper
   def user_avatar(user)
     if user.avatar.attached?
-      user.avatar
+      url_for(user.avatar)
     else
       image_url "avatar.svg"
     end

app/javascript/packs/application.js

@@ -1,14 +1,13 @@
-import "../stylesheets/application.scss";
-
+import "@fontsource/plus-jakarta-sans";
 import * as ActiveStorage from "@rails/activestorage";
 import Rails from "@rails/ujs";
+import "alpine-turbo-drive-adapter";
 import * as ReactRailsUJS from "react_ujs";
 
-import "alpine-turbo-drive-adapter";
 require("alpinejs");
 require("jquery");
 
-import "@fontsource/plus-jakarta-sans";
+import "../stylesheets/application.scss";
 
 global.toastr = require("toastr");
 global.toastr.options = {

app/javascript/packs/org_timezones.js

@@ -0,0 +1,41 @@
+/* eslint-disable space-before-function-paren */
+/* eslint-disable func-style */
+
+document.addEventListener("DOMContentLoaded", function () {
+  let timezones = [];
+
+  function setTimeZoneOptions(options) {
+    const timeZoneSelect = document.querySelector(".select-timezone");
+    timeZoneSelect.innerHTML = "";
+    options.forEach((option) => {
+      const optionElement = document.createElement("option");
+      optionElement.value = option;
+      optionElement.innerText = option;
+      if (window.location.pathname === "/company/new") {
+        optionElement.selected =
+          option === "(GMT-05:00) Eastern Time (US & Canada)";
+      }
+      timeZoneSelect.appendChild(optionElement);
+    });
+  }
+
+  function handleChangeCountry(event) {
+    const country = event.target.value;
+    const timeZonesForCountry = timezones[country];
+    if (timeZonesForCountry) setTimeZoneOptions(timeZonesForCountry);
+  }
+
+  const selectCountry = document.querySelector(".select-country");
+
+  selectCountry.addEventListener("change", handleChangeCountry);
+
+  async function main() {
+    const response = await fetch("/internal_api/v1/timezones");
+    const jsonResponse = await response.json();
+    timezones = jsonResponse.timezones;
+    if (window.location.pathname === "/company/new")
+      setTimeZoneOptions(timezones[selectCountry.value]);
+  }
+
+  main();
+});

app/javascript/packs/server_rendering.js

@@ -1,7 +1,8 @@
 // By default, this pack is loaded for server-side rendering.
 // It must expose react_ujs as `ReactRailsUJS` and prepare a require context.
-import "../stylesheets/application.scss";
 
 const componentRequireContext = require.context("src/components", true);
 import * as ReactRailsUJS from "react_ujs";
+
+import "../stylesheets/application.scss";
 ReactRailsUJS.useContext(componentRequireContext);

app/javascript/src/apis/reports.ts

@@ -10,6 +10,6 @@ const download = (type, queryParams) => axios({
   responseType: "blob"
 });
 
-const reports = { get, download };
+const reportsApi = { get, download };
 
-export default reports;
+export default reportsApi;

app/javascript/src/apis/team.ts

@@ -18,7 +18,7 @@ const inviteMember = payload => axios.post("/invitations",payload);
 const updateInvitedMember = (id,payload) => axios.put(`/invitations/${id}`,payload);
 const deleteInvitedMember = id => axios.delete(`/invitations/${id}`);
 
-export {
+const teamApi =  {
   get,
   search,
   destroyTeamMember,
@@ -27,3 +27,5 @@ export {
   deleteInvitedMember,
   inviteMember
 };
+
+export default teamApi;

app/javascript/src/apis/timeTracking.ts

@@ -4,4 +4,6 @@ const path = "/time-tracking";
 
 const get = async () => axios.get(path);
 
-export default { get };
+const timeTrackingApi = { get };
+
+export default timeTrackingApi;

app/javascript/src/common/AutoComplete.tsx

@@ -1,4 +1,5 @@
 import React, { useState } from "react";
+
 import Autocomplete from "react-autocomplete";
 import { useNavigate } from "react-router-dom";
 

app/javascript/src/common/ChartBar/index.tsx

@@ -1,7 +1,9 @@
 import React, { Fragment } from "react";
+
 import ReactTooltip from "react-tooltip";
 
 import { minutesToHHMM } from "helpers/hhmm-parser";
+
 import { IChartBarGraph, ISingleClient } from "./interface";
 
 const Client = ({ element, totalMinutes, index }:ISingleClient) => {

app/javascript/src/common/CustomDatePicker/index.tsx

@@ -1,8 +1,8 @@
 import React from "react";
-import DatePicker from "react-datepicker";
+
 import { getMonth, getYear } from "date-fns";
 import { CaretCircleLeft, CaretCircleRight } from "phosphor-react";
-
+import DatePicker from "react-datepicker";
 import "react-datepicker/dist/react-datepicker.css";
 
 const CustomDatePicker = ({ handleChange, dueDate }) => {

app/javascript/src/common/Pagination.tsx

@@ -1,4 +1,5 @@
 import * as React from "react";
+
 import cn from "classnames";
 import { CaretCircleLeft, CaretCircleRight } from "phosphor-react";
 

app/javascript/src/common/SyncAutoComplete.tsx

@@ -1,8 +1,9 @@
 // NOTE: This file is for synchronous auto complete.
 
 import React, { useState, useEffect } from "react";
-import Autocomplete from "react-autocomplete";
+
 import { MagnifyingGlass } from "phosphor-react";
+import Autocomplete from "react-autocomplete";
 
 const cssStyles = {
   menuStyles: {

app/javascript/src/common/Table/index.tsx

@@ -1,7 +1,8 @@
 import React from "react";
-import { useTable, useRowSelect } from "react-table";
-import PropTypes from "prop-types";
+
 import { Pencil, Trash } from "phosphor-react";
+import PropTypes from "prop-types";
+import { useTable, useRowSelect } from "react-table";
 
 const IndeterminateCheckbox = React.forwardRef( // eslint-disable-line react/display-name
   ({ indeterminate, ...rest }:any, ref) => {

app/javascript/src/common/Toastr.tsx

@@ -1,6 +1,7 @@
 import React from "react";
 
 import { toast, Slide } from "react-toastify";
+
 import { GetToasterIcon, getToasterCloseButton } from "../constants/index";
 
 const customId = "custom-toaster-id";

app/javascript/src/components/App.tsx

@@ -1,9 +1,13 @@
 import React, { Fragment, useEffect } from "react";
+
+import { Roles, TOASTER_DURATION } from "constants/index";
+
 import { BrowserRouter } from "react-router-dom";
 import { ToastContainer } from "react-toastify";
+
 import { setAuthHeaders, registerIntercepts } from "apis/axios";
 import UserContext from "context/UserContext";
-import { Roles, TOASTER_DURATION } from "constants/index";
+
 import Main from "./Main";
 import Navbar from "./Navbar";
 

app/javascript/src/components/Clients/Details/Header.tsx

@@ -1,6 +1,7 @@
 import React, { useState } from "react";
-import { useNavigate } from "react-router-dom";
+
 import { ArrowLeft, DotsThreeVertical, Receipt, Pencil, CaretDown, Trash } from "phosphor-react";
+import { useNavigate } from "react-router-dom";
 
 import AddProject from "../Modals/AddProject";
 import DeleteClient from "../Modals/DeleteClient";

app/javascript/src/components/Clients/Details/index.tsx

@@ -1,9 +1,12 @@
 import React, { useEffect, useState } from "react";
+
+import { TOASTER_DURATION } from "constants/index";
+
 import { useParams } from "react-router-dom";
 import { ToastContainer } from "react-toastify";
+
 import { setAuthHeaders, registerIntercepts } from "apis/axios";
 import clientApi from "apis/clients";
-
 import AmountBoxContainer from "common/AmountBox";
 import ChartBar from "common/ChartBar";
 import Table from "common/Table";
@@ -13,8 +16,8 @@ import { cashFormatter } from "helpers/cashFormater";
 import { currencySymbol } from "helpers/currencySymbol";
 import { sendGAPageView } from "utils/googleAnalytics";
 
-import { TOASTER_DURATION } from "constants/index";
 import Header from "./Header";
+
 import { unmapClientDetails } from "../../../mapper/client.mapper";
 
 const getTableData = (clients) => {
@@ -67,10 +70,7 @@ const ClientList = ({ isAdminUser }) => {
       });
   };
 
-  useEffect(() => {
-    sendGAPageView();
-    setAuthHeaders();
-    registerIntercepts();
+  const fetchProjectList = () => {
     clientApi.show(params.clientId, "?time_frame=week")
       .then((res) => {
         const sanitized = unmapClientDetails(res);
@@ -79,6 +79,13 @@ const ClientList = ({ isAdminUser }) => {
         setTotalMinutes(sanitized.totalMinutes);
         setOverDueOutstandingAmt(sanitized.overdueOutstandingAmount);
       });
+  };
+
+  useEffect(() => {
+    sendGAPageView();
+    setAuthHeaders();
+    registerIntercepts();
+    fetchProjectList();
   }, []);
 
   const tableHeader = [
@@ -134,7 +141,7 @@ const ClientList = ({ isAdminUser }) => {
                     THIS WEEK
               </option>
               <option className="text-miru-dark-purple-600" value="month">
-                    This MONTH
+                    THIS MONTH
               </option>
               <option className="text-miru-dark-purple-600" value="year">
                     THIS YEAR
@@ -173,6 +180,7 @@ const ClientList = ({ isAdminUser }) => {
         <DeleteProject
           setShowDeleteDialog={setShowDeleteDialog}
           project={selectedProject}
+          fetchProjectList={fetchProjectList}
         />
       )}
     </>