eduvia/workavia-calendar-front
11
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

#12 topbar search (#371)

Browse Source 
- added search in topbar
 - added skeleton search results page
 - added tests
 - set personal calendars as default search in and allow to select personal and shared as a search in option

---------

Co-authored-by: Camille Moussu <cmoussu@linagora.com>
This commit is contained in:
Camille Moussu
2025-11-28 14:54:13 +01:00
committed by GitHub
parent 1a85afc57d
commit ae17ac2bd6
20 changed files with 1508 additions and 152 deletions
Download Patch File Download Diff File Expand all files Collapse all files
__test__/features/Search/SearchResultsPage.test.tsx
+225
View File
@@ -0,0 +1,225 @@
import { screen } from "@testing-library/react";
import SearchResultsPage from "../../../src/features/Search/SearchResultsPage";
import { renderWithProviders } from "../../utils/Renderwithproviders";
describe("SearchResultsPage", () => {
const today = new Date();
const start = new Date(today);
start.setHours(10, 0, 0, 0);
const end = new Date(today);
end.setHours(11, 0, 0, 0);
const preloadedState = {
user: {
userData: {
sub: "test",
email: "test@test.com",
sid: "mockSid",
openpaasId: "user1",
},
tokens: { accessToken: "token" },
},
calendars: {
list: {
"user1/cal1": {
name: "Calendar personal",
id: "user1/cal1",
color: { light: "#FF0000", dark: "#000" },
ownerEmails: ["alice@example.com"],
events: {
event1: {
id: "event1",
calId: "user1/cal1",
uid: "event1",
title: "Test Event",
start: start.toISOString(),
end: end.toISOString(),
partstat: "ACCEPTED",
organizer: {
cn: "Alice",
cal_address: "alice@example.com",
},
attendee: [
{
cn: "Alice",
partstat: "ACCEPTED",
rsvp: "TRUE",
role: "REQ-PARTICIPANT",
cutype: "INDIVIDUAL",
cal_address: "alice@example.com",
},
],
},
},
},
"user2/cal1": {
name: "Calendar delegated",
delegated: true,
id: "user2/cal1",
color: { light: "#FF0000", dark: "#000" },
ownerEmails: ["alice@example.com"],
events: {
event1: {
id: "event1",
calId: "user2/cal1",
uid: "event1",
title: "Test Event",
start: start.toISOString(),
end: end.toISOString(),
partstat: "ACCEPTED",
organizer: {
cn: "Alice",
cal_address: "alice@example.com",
},
attendee: [
{
cn: "Alice",
partstat: "ACCEPTED",
rsvp: "TRUE",
role: "REQ-PARTICIPANT",
cutype: "INDIVIDUAL",
cal_address: "alice@example.com",
},
],
},
},
},
"user3/cal1": {
name: "Calendar shared",
id: "user3/cal1",
color: { light: "#FF0000", dark: "#000" },
ownerEmails: ["alice@example.com"],
events: {
event1: {
id: "event1",
calId: "user3/cal1",
uid: "event1",
title: "Test Event",
start: start.toISOString(),
end: end.toISOString(),
partstat: "ACCEPTED",
organizer: {
cn: "Alice",
cal_address: "alice@example.com",
},
attendee: [
{
cn: "Alice",
partstat: "ACCEPTED",
rsvp: "TRUE",
role: "REQ-PARTICIPANT",
cutype: "INDIVIDUAL",
cal_address: "alice@example.com",
},
],
},
},
},
},
pending: false,
},
};
it("should show loading spinner when loading", () => {
renderWithProviders(<SearchResultsPage />, {
...preloadedState,
searchResult: { loading: true, error: null, hits: 0, results: [] },
});
expect(screen.getByRole("progressbar")).toBeInTheDocument();
});
it("should show error message when error occurs", () => {
renderWithProviders(<SearchResultsPage />, {
...preloadedState,
searchResult: {
loading: false,
error: "Network error",
hits: 0,
results: [],
},
});
expect(screen.getByText("Network error")).toBeInTheDocument();
});
it("should show no results message when no hits", () => {
renderWithProviders(<SearchResultsPage />, {
...preloadedState,
searchResult: { loading: false, error: null, hits: null, results: [] },
});
expect(screen.getByText("search.noResults")).toBeInTheDocument();
});
it("should render search results", () => {
const mockResults = [
{
data: {
uid: "1",
summary: "Team Meeting",
start: "2025-06-26T15:00:00Z",
organizer: { cn: "John Doe", email: "john@example.com" },
allDay: false,
},
},
{
data: {
uid: "2",
summary: "Project Review",
start: "2025-06-27T10:00:00Z",
organizer: { cn: "Jane Smith", email: "jane@example.com" },
allDay: false,
},
},
];
renderWithProviders(<SearchResultsPage />, {
...preloadedState,
searchResult: { results: mockResults, hits: 2 },
});
expect(screen.getByText("search.resultsTitle")).toBeInTheDocument();
expect(screen.getByText("Team Meeting")).toBeInTheDocument();
expect(screen.getByText("Project Review")).toBeInTheDocument();
expect(screen.getByText("John Doe")).toBeInTheDocument();
expect(screen.getByText("Jane Smith")).toBeInTheDocument();
});
it("should handle events without organizer", () => {
const mockResults = [
{
data: {
uid: "1",
summary: "Untitled Event",
start: "2025-06-26T15:00:00Z",
allDay: false,
},
},
];
renderWithProviders(<SearchResultsPage />, {
...preloadedState,
searchResult: { results: mockResults, hits: 1 },
});
expect(screen.getByText("Untitled Event")).toBeInTheDocument();
expect(screen.getByText("-")).toBeInTheDocument();
});
it("should format all-day events correctly", () => {
const mockResults = [
{
data: {
uid: "1",
summary: "All Day Event",
start: "2025-06-26T00:00:00Z",
organizer: { cn: "Organizer" },
allDay: true,
},
},
];
renderWithProviders(<SearchResultsPage />, {
...preloadedState,
searchResult: { results: mockResults, hits: 1 },
});
expect(screen.getByText("All Day Event")).toBeInTheDocument();
});
});