51 | {parsedAnswer.citations.map((citation, idx) => {
52 | return (
53 |
56 | e.key === " " || e.key === "Enter"
57 | ? onCitationClicked(citation)
58 | : () => { }
59 | }
60 | tabIndex={0}
61 | title={createCitationFilepath(citation, ++idx)}
62 | key={idx}
63 | onClick={() => onCitationClicked(citation)}
64 | className={"citationContainer"}
65 | >
66 |
69 | {idx}
70 |
71 | {createCitationFilepath(citation, idx, true)}
72 |
73 | );
74 | })}
75 |
)
76 | };
77 |
78 |
79 | export default Citations;
--------------------------------------------------------------------------------
/src/App/src/components/CustomSpinner/CustomSpinner.module.css:
--------------------------------------------------------------------------------
1 | /* Full-screen overlay */
2 | .overlay {
3 | position: fixed;
4 | top: 0;
5 | left: 0;
6 | width: 100%;
7 | height: 100%;
8 | background-color: rgba(0, 0, 0, 0.5); /* semi-transparent black background */
9 | display: flex;
10 | align-items: center;
11 | justify-content: center;
12 | z-index: 999999999; /* Ensure it is above other content */
13 | }
14 |
15 |
--------------------------------------------------------------------------------
/src/App/src/components/CustomSpinner/CustomSpinner.tsx:
--------------------------------------------------------------------------------
1 | import React from "react";
2 | import { Spinner, SpinnerSize, ISpinnerStyles } from "@fluentui/react";
3 | import styles from "./CustomSpinner.module.css";
4 |
5 | interface CustomSpinnerProps {
6 | loading: boolean;
7 | label?: string; // Label is optional
8 | }
9 |
10 | const spinnerStyles: ISpinnerStyles = {
11 | label: {
12 | fontSize: "20px",
13 | color: "rgb(91 184 255)",
14 | fontWeight: 600,
15 | },
16 | };
17 |
18 | const CustomSpinner: React.FC