inline support finished

Author: RafaelGB

src/cdm/RowSelectModel.ts

@@ -1,5 +1,6 @@
 import { ActionType } from "react-table";
 import NoteInfo from "services/NoteInfo";
+import { TableDataType } from "cdm/FolderModel";
 
 export type RowSelectOption = {
     backgroundColor: string,
@@ -11,4 +12,5 @@ export type PopperProps = {
     column: any;
     columns: any;
     note: NoteInfo;
+    state: TableDataType;
 };

src/components/Cell.tsx

@@ -122,6 +122,7 @@ export default function DefaultCell(cellProperties: Cell) {
               column={cellProperties.column}
               columns={columns}
               note={note}
+              state={(cellProperties as any).initialState}
             />
           </CellContext.Provider>
         );

src/components/HeaderMenu.tsx

@@ -19,6 +19,7 @@ import React, { useContext, useEffect, useState } from "react";
 import { ActionType } from "react-table";
 import { usePopper } from "react-popper";
 import { HeaderContext } from "components/contexts/HeaderContext";
+import { Checkbox, FormControlLabel, FormGroup } from "@material-ui/core";
 type HeaderMenuProps = {
   dispatch: (action: ActionType) => void;
   setSortBy: any;
@@ -199,6 +200,15 @@ const HeaderMenu = (headerMenuProps: HeaderMenuProps) => {
     strategy: "fixed",
   });
 
+  const settingsPopper = usePopper(
+    settingsReferenceElement,
+    settingsPopperElement,
+    {
+      placement: "right",
+      strategy: "fixed",
+    }
+  );
+
   function persistLabelChange() {
     dispatch({
       type: ActionTypes.UPDATE_COLUMN_LABEL,
@@ -294,7 +304,7 @@ const HeaderMenu = (headerMenuProps: HeaderMenuProps) => {
                 Property Type
               </span>
             </div>
-            {/** Edit header label section */}
+            {/** Type of column section */}
             <div style={{ padding: "4px 0px" }}>
               <button
                 className="sort-button"
@@ -336,6 +346,7 @@ const HeaderMenu = (headerMenuProps: HeaderMenuProps) => {
                 </div>
               )}
             </div>
+            {/** Action buttons section */}
             <div
               style={{
                 borderTop: `2px solid ${StyleVariables.BACKGROUND_DIVIDER}`,
@@ -362,7 +373,7 @@ const HeaderMenu = (headerMenuProps: HeaderMenuProps) => {
                 padding: "4px 0px",
               }}
             >
-              {/** Column settings */}
+              {/** Column settings section */}
               <div style={{ padding: "4px 0px" }}>
                 <button
                   className="sort-button"
@@ -376,7 +387,31 @@ const HeaderMenu = (headerMenuProps: HeaderMenuProps) => {
                   </span>
                   <span>Settings</span>
                 </button>
-                {showSettings && <span>pruebas</span>}
+                {showSettings && (
+                  <div
+                    className="shadow-5 border-radius-m"
+                    ref={setSettingsPopperElement}
+                    onMouseEnter={() => setShowSettings(true)}
+                    onMouseLeave={() => setShowSettings(false)}
+                    {...settingsPopper.attributes.popper}
+                    style={{
+                      ...settingsPopper.styles.popper,
+                      width: 200,
+                      backgroundColor: StyleVariables.BACKGROUND_SECONDARY,
+                      zIndex: 4,
+                      padding: "4px 0px",
+                    }}
+                  >
+                    <FormGroup>
+                      <FormControlLabel
+                        control={
+                          <Checkbox checked={headerMenuProps.column.isInline} />
+                        }
+                        label="Inline"
+                      />
+                    </FormGroup>
+                  </div>
+                )}
               </div>
             </div>
           </div>

src/components/portals/PopperSelectPortal.tsx

@@ -9,7 +9,7 @@ import { PopperProps } from "cdm/RowSelectModel";
 import { CellContext } from "components/contexts/CellContext";
 
 const PopperSelectPortal = (popperProps: PopperProps) => {
-  const { dispatch, row, column, columns, note } = popperProps;
+  const { dispatch, row, column, columns, note, state } = popperProps;
   /** state of cell value */
   const { value, setValue } = useContext(CellContext);
   // Selector reference state
@@ -41,6 +41,7 @@ const PopperSelectPortal = (popperProps: PopperProps) => {
       value: option.label,
       row: row,
       columnId: column.id,
+      state: state,
     });
   }
 

src/components/reducers/DatabaseDispatch.tsx

@@ -342,7 +342,7 @@ export function databaseReducer(state: TableDataType, action: ActionType) {
           ...state.columns.slice(deleteIndex + 1, state.columns.length),
         ],
       };
-    case ActionTypes.UPDATE_OPTION_CELL: // save on disk
+    case ActionTypes.UPDATE_OPTION_CELL:
       // check if this column is configured as a group folder
       if (dbconfig.group_folder_column === action.key) {
         moveFile(`${state.view.file.parent.path}/${action.value}`, action);

src/helpers/VaultManagement.ts

@@ -248,13 +248,13 @@ export async function moveFile(folderPath: string, action: ActionType): Promise<
     UpdateRowOptions.COLUMN_VALUE
   );
   try {
-    createFolder(folderPath);
+    await createFolder(folderPath);
   } catch (error) {
     LOGGER.error(` moveFile Error: ${error.message} `);
     // Handle error
     throw error;
   }
-  const filePath = `${folderPath} /${action.file.name}`;
+  const filePath = `${folderPath}/${action.file.name}`;
   await app.fileManager.renameFile(action.file, filePath);
 }