feat(FilesManager): replace a file's body

client/package.json

@@ -19,17 +19,21 @@
     "date-fns": "^2.29.3",
     "date-fns-tz": "^2.0.0",
     "dompurify": "^2.3.3",
+    "file-saver": "^2.0.5",
     "focus-trap-react": "^10.1.1",
     "frappe-gantt": "^0.5.0",
     "html-react-parser": "^1.2.7",
     "js-cookie": "^2.2.1",
     "marked": "^4.0.10",
+    "papaparse": "^5.4.1",
     "prop-types": "^15.7.2",
+    "qs": "^6.11.2",
     "query-string": "^6.14.1",
     "react": "^17.0.2",
     "react-big-calendar": "^0.38.1",
     "react-circular-progressbar": "^2.1.0",
     "react-color": "^2.19.3",
+    "react-cool-inview": "^3.0.1",
     "react-datepicker": "^4.12.0",
     "react-day-picker": "^8.6.0",
     "react-dom": "^17.0.2",
@@ -48,7 +52,8 @@
     "style-it": "^2.1.4",
     "typescript": "^4.9.5",
     "validator": "^13.7.0",
-    "web-vitals": "^0.2.4"
+    "web-vitals": "^0.2.4",
+    "zod": "^3.22.4"
   },
   "eslintConfig": {
     "extends": [
@@ -72,9 +77,12 @@
   "devDependencies": {
     "@types/date-and-time": "^0.13.0",
     "@types/dompurify": "^3.0.0",
+    "@types/file-saver": "^2.0.6",
     "@types/js-cookie": "^3.0.3",
     "@types/marked": "^4.0.8",
     "@types/node": "^18.14.0",
+    "@types/papaparse": "^5.3.14",
+    "@types/qs": "^6.9.10",
     "@types/react": "^18.0.28",
     "@types/react-datepicker": "^4.11.2",
     "@types/react-dom": "^18.0.11",

client/src/Conductor.jsx

@@ -40,7 +40,7 @@ import ProjectsFlagged from './components/projects/ProjectsFlagged';
 import ProjectsPortal from './components/projects/ProjectsPortal';
 import ProjectTimeline from './components/projects/ProjectTimeline';
 import ProjectView from './components/projects/ProjectView';
-import Search from './components/search/Search';
+const Search = lazy(() => import('./screens/conductor/Search'));
 import UserDetails from './components/controlpanel/UserDetails';
 import UsersManager from './components/controlpanel/UsersManager';
 import LoadingSpinner from './components/LoadingSpinner';
@@ -87,7 +87,7 @@ const Conductor = () => {
         <PrivateRoute exact path='/controlpanel' component={ControlPanel} />
         <PrivateRoute exact path='/controlpanel/adoptionreports' component={AdoptionReports} />
         <PrivateRoute exact path='/controlpanel/analyticsrequests' component={AnalyticsRequests} />
-        {/*<PrivateRoute exact path='/controlpanel/assettagsmanager' component={AssetTagsManager} />*/}
+        <PrivateRoute exact path='/controlpanel/assettagsmanager' component={AssetTagsManager} />
         <PrivateRoute exact path='/controlpanel/booksmanager' component={BooksManager} />
         <PrivateRoute exact path='/controlpanel/campussettings' component={CampusSettings} />
         <PrivateRoute exact path='/controlpanel/collectionsmanager' component={CollectionsManager} />

client/src/Platform.jsx

@@ -49,6 +49,7 @@ const Platform = () => {
     "/homework",
     "/underdevelopment",
     "/libraries",
+    "/search-results",
   ];
   const standalonePaths = [
     "/adopt",

client/src/api.ts

@@ -0,0 +1,304 @@
+import axios from "axios";
+import {
+  AssetTagFramework,
+  AssetTagFrameworkWithCampusDefault,
+  Book,
+  CentralIdentityLicense,
+  CentralIdentityOrg,
+  ConductorBaseResponse,
+  Homework,
+  Project,
+  ProjectFile,
+  User,
+} from "./types";
+import {
+  CIDDescriptor,
+  ProjectFileWProjectID,
+  ProjectTag,
+} from "./types/Project";
+
+/**
+ * @fileoverview
+ * We don't create an Axios instance here because not all api calls
+ * have been converted to use this class yet, but we still want global config to apply
+ */
+
+class API {
+  // ASSET TAGS FRAMEWORKS
+  async getFrameworks({
+    page,
+    limit,
+    sort,
+    query,
+  }: {
+    page?: number;
+    limit?: number;
+    sort?: string;
+    query?: string;
+  }) {
+    const res = await axios.get<
+      {
+        frameworks: AssetTagFrameworkWithCampusDefault[];
+        totalCount: number;
+      } & ConductorBaseResponse
+    >("/assettagframeworks", {
+      params: {
+        page,
+        limit,
+        sort,
+        query,
+      },
+    });
+    return res;
+  }
+
+  async getFramework(id: string) {
+    const res = await axios.get<
+      {
+        framework: AssetTagFramework;
+      } & ConductorBaseResponse
+    >(`/assettagframeworks/${id}`);
+    return res;
+  }
+
+  async getCampusDefaultFramework(orgID: string) {
+    const res = await axios.get<
+      {
+        framework: AssetTagFramework | null;
+      } & ConductorBaseResponse
+    >(`/assettagframeworks/campusdefault/${orgID}`);
+    return res;
+  }
+
+  async createFramework(framework: AssetTagFramework) {
+    const res = await axios.post<
+      {
+        framework: AssetTagFramework;
+      } & ConductorBaseResponse
+    >("/assettagframeworks", framework);
+    return res;
+  }
+
+  async updateFramework(framework: AssetTagFramework) {
+    const res = await axios.patch<
+      {
+        framework: AssetTagFramework;
+      } & ConductorBaseResponse
+    >(`/assettagframeworks/${framework.uuid}`, framework);
+    return res;
+  }
+
+  async setAsCampusDefaultFramework(orgID: string, frameworkID: string) {
+    const res = await axios.put<ConductorBaseResponse>(`/org/${orgID}`, {
+      defaultAssetTagFrameworkUUID: frameworkID,
+    });
+    return res;
+  }
+
+  // Central Identity
+  async getCentralIdentityOrgs({
+    activePage,
+    limit,
+    query,
+  }: {
+    activePage?: number;
+    limit?: number;
+    query?: string;
+  }) {
+    const res = await axios.get<
+      {
+        orgs: CentralIdentityOrg[];
+        totalCount: number;
+      } & ConductorBaseResponse
+    >("/central-identity/orgs", {
+      params: {
+        activePage,
+        limit,
+        query,
+      },
+    });
+    return res;
+  }
+
+  async getCentralIdentityLicenses() {
+    const res = await axios.get<
+      {
+        licenses: CentralIdentityLicense[];
+      } & ConductorBaseResponse
+    >("/central-identity/licenses");
+    return res;
+  }
+
+  // Commons
+  async getCommonsCatalog(paramsObj?: { activePage?: number; limit?: number }) {
+    const res = await axios.get<
+      {
+        books: Book[];
+        numFound: number;
+        numTotal: number;
+      } & ConductorBaseResponse
+    >("/commons/catalog", {
+      params: paramsObj,
+    });
+    return res;
+  }
+
+  // Search
+  async conductorSearch({
+    searchQuery,
+    projLocation,
+    projStatus,
+    projVisibility,
+    projSort,
+    bookSort,
+    hwSort,
+    userSort,
+    activePage,
+    limit,
+  }: {
+    searchQuery?: string;
+    projLocation?: string;
+    projStatus?: string;
+    projVisibility?: string;
+    projSort?: string;
+    bookSort?: string;
+    hwSort?: string;
+    userSort?: string;
+    activePage?: number;
+    limit?: number;
+  }) {
+    const res = await axios.get<
+      {
+        numResults: number;
+        results: {
+          projects: Project[];
+          books: Book[];
+          files: ProjectFileWProjectID[];
+          homework: Homework[];
+          users: User[];
+        };
+      } & ConductorBaseResponse
+    >("/search", {
+      params: {
+        searchQuery,
+        projLocation,
+        projStatus,
+        projVisibility,
+        projSort,
+        bookSort,
+        hwSort,
+        userSort,
+        activePage,
+        limit,
+      },
+    });
+    return res;
+  }
+
+  //Projects
+  async getPublicProjects(params?: { page?: number; limit?: number }) {
+    const res = await axios.get<
+      {
+        projects: Project[];
+        totalCount: number;
+      } & ConductorBaseResponse
+    >("/projects/public", {
+      params,
+    });
+    return res;
+  }
+  async getProject(projectID: string) {
+    const res = await axios.get("/project", {
+      params: {
+        projectID,
+      },
+    });
+    return res;
+  }
+
+  async deleteProject(projectID: string) {
+    const res = await axios.delete(`/project/${projectID}`);
+    return res;
+  }
+
+  async getTags() {
+    const res = await axios.get<{ tags: ProjectTag[] } & ConductorBaseResponse>(
+      "projects/tags/org"
+    );
+    return res;
+  }
+
+  async getCIDDescriptors(detailed?: boolean) {
+    const res = await axios.get<
+      {
+        descriptors: CIDDescriptor[];
+      } & ConductorBaseResponse
+    >("/c-ids", {
+      params: {
+        detailed,
+      },
+    });
+    return res;
+  }
+
+  async getProjectFiles(projectID: string, folderID?: string) {
+    const res = await axios.get<
+      {
+        files: ProjectFile[];
+        path: { fileID: string; name: string }[];
+      } & ConductorBaseResponse
+    >(`/project/${projectID}/files/content/${folderID ? folderID : ""}`);
+    return res;
+  }
+
+  async getProjectFile(projectID: string, fileID: string) {
+    const res = await axios.get<
+      {
+        file: ProjectFile;
+      } & ConductorBaseResponse
+    >(`/project/${projectID}/files/${fileID}`);
+    return res;
+  }
+
+  async getFileDownloadURL(
+    projectID: string,
+    fileID: string,
+    shouldIncrement?: boolean
+  ) {
+    const res = await axios.get<
+      {
+        url: string;
+      } & ConductorBaseResponse
+    >(`/project/${projectID}/files/${fileID}/download`, {
+      params: {
+        shouldIncrement,
+      },
+    });
+    return res;
+  }
+
+  async bulkDownloadFiles(projectID: string, fileIDs: string[]) {
+    const arrQuery = fileIDs.map((id) => `fileID=${id}`).join(`&`);
+    const res = await axios.get<Blob>(`/project/${projectID}/files/bulk`, {
+      params: {
+        fileIDs: arrQuery,
+      },
+      responseType: "blob",
+    });
+    return res;
+  }
+
+  async getPublicProjectFiles(params?: { page?: number; limit?: number }) {
+    const res = await axios.get<
+      {
+        files: ProjectFileWProjectID[];
+        totalCount: number;
+      } & ConductorBaseResponse
+    >("/projects/files/public", {
+      params,
+    });
+    return res;
+  }
+}
+
+export default new API();

client/src/components/ControlledInputs/CtlCheckbox.tsx

@@ -9,7 +9,7 @@ import { ControlledInputProps } from "../../types";
 
 interface CtlCheckboxProps extends CheckboxProps {
   label?: string;
-  labelDirection?: "col" | "row";
+  labelDirection?: "col" | "row" | "col-reverse" | "row-reverse";
   required?: boolean;
   negated?: boolean;
 }
@@ -51,7 +51,7 @@ export default function CtlCheckbox<
         fieldState: { error },
       }) => (
         <div
-          className={labelDirection === "row" ? "flex-row-div" : "flex-col-div"}
+          className={`flex flex-${labelDirection} items-center`}
         >
           {label && (
             <label