Merge branch 'master' into frontend-release

.github/pull_request_template.md

@@ -4,6 +4,8 @@ Provide an overview of your PR here.
 
 # Checklist
 
-- [ ] I have installed `pre-commit` and run the hooks with `pre-commit run`.
+- [ ] I have installed `pre-commit` and installed the hooks with `pre-commit install` before creating any commits.
 - [ ] I have updated any related tests for code I modified or added new tests where appropriate.
+- [ ] I have manually tested my changes as follows:
+  - <!-- Insert your manual testing steps here. -->
 - [ ] I have updated any relevant documentation or created new documentation where appropriate.

frontend/src/app/app.tsx

@@ -16,6 +16,7 @@ import { SelectedImagesRibbon } from "@/features/bulkManagement/bulkManagementRi
 import { CardGrid } from "@/features/card/cardGrid";
 import { CommonCardback } from "@/features/card/commonCardback";
 import { Export } from "@/features/export/export";
+import { FinishedMyProject } from "@/features/export/finishedMyProjectModal";
 import { FinishSettings } from "@/features/finishSettings/finishSettings";
 import { Import } from "@/features/import/import";
 import {
@@ -98,15 +99,16 @@ function App() {
             <Row className="g-0 pt-2">
               <SearchSettings />
             </Row>
-            <Row className="g-0 py-2">
-              <Col lg={6} md={12} sm={12} xs={12}>
+            <Row className="g-0 pt-2">
+              <Col lg={7} md={12} sm={12} xs={12}>
                 <Import />
               </Col>
-              <Col lg={6} md={12} sm={12} xs={12}>
+              <Col lg={5} md={12} sm={12} xs={12}>
                 <Export />
               </Col>
+              <FinishedMyProject />
             </Row>
-            <Col className="g-0" lg={{ span: 8, offset: 2 }} md={12}>
+            <Col className="g-0 pt-2" lg={{ span: 8, offset: 2 }} md={12}>
               <CommonCardback selectedImage={cardback} />
             </Col>
           </OverflowCol>

frontend/src/common/types.ts

@@ -242,7 +242,8 @@ export type Modals =
   | "changeQuery"
   | "supportDeveloper"
   | "supportBackend"
-  | "invalidIdentifiers";
+  | "invalidIdentifiers"
+  | "finishedMyProject";
 
 export interface ModalsState {
   card: CardDocument | null;

frontend/src/features/export/export.tsx

@@ -10,14 +10,14 @@ export function Export() {
   return (
     <Dropdown>
       <div className="d-grid gap-0">
-        <Dropdown.Toggle variant="success" id="dropdown-basic">
+        <Dropdown.Toggle variant="secondary" id="dropdown-basic">
           <RightPaddedIcon bootstrapIconName="cloud-arrow-down" /> Download
         </Dropdown.Toggle>
       </div>
       <Dropdown.Menu>
-        <ExportDecklist />
         <ExportXML />
         <ExportImages />
+        <ExportDecklist />
       </Dropdown.Menu>
     </Dropdown>
   );

frontend/src/features/export/exportXML.tsx

@@ -207,30 +207,26 @@ export function generateXML(
   return formatXML(xml, { collapseContent: true });
 }
 
-export function ExportXML() {
-  //# region queries and hooks
-
+export function useExportXML() {
   const store = useStore();
-  const isProjectEmpty = useAppSelector(selectIsProjectEmpty);
-
-  //# endregion
 
-  //# region callbacks
-
-  const downloadFile = () => {
+  return () => {
     const generatedXML = selectGeneratedXML(store.getState() as RootState);
     saveAs(
       new Blob([generatedXML], { type: "text/xml;charset=utf-8" }),
       "cards.xml"
     );
   };
+}
 
-  //# endregion
+export function ExportXML() {
+  const exportXML = useExportXML();
+  const isProjectEmpty = useAppSelector(selectIsProjectEmpty);
 
   return (
     <Dropdown.Item
       disabled={isProjectEmpty}
-      onClick={downloadFile}
+      onClick={exportXML}
       data-testid="export-xml-button"
     >
       <RightPaddedIcon bootstrapIconName="file-code" /> XML