add tooltip with other languages; some skeletons; fix hydration issue

rage · May 19, 2023 · 6ad5798 · 6ad5798
1 parent cd541fa
commit 6ad5798
Show file tree

Hide file tree

Showing 18 changed files with 483 additions and 245 deletions.
diff --git a/frontend/components/Dashboard/Editor/Common/Fields/ControlledCheckbox.tsx b/frontend/components/Dashboard/Editor/Common/Fields/ControlledCheckbox.tsx
@@ -6,14 +6,15 @@ import { Checkbox, FormControlLabel } from "@mui/material"
 import { styled } from "@mui/material/styles"
 
 import { ControlledFieldProps } from "."
-import { InfoTooltipWithLabel } from "/components/Tooltip"
+import { InfoTooltip } from "/components/Tooltip"
 import { useAnchor } from "/hooks/useAnchors"
 
 const AlignedSpan = styled("span")`
   display: flex;
   align-items: flex-end;
   gap: 0.5rem;
 `
+
 interface ControlledCheckboxProps<
   TFieldValues extends FieldValues = FieldValues,
 > extends ControlledFieldProps<TFieldValues> {
@@ -26,7 +27,7 @@ const ControlledCheckboxLabel = React.memo(
     return (
       <AlignedSpan>
         {label}
-        {tip && <InfoTooltipWithLabel label={label} title={tip} />}
+        {tip && <InfoTooltip label={label} title={tip} />}
       </AlignedSpan>
     )
   },

diff --git a/frontend/components/Dashboard/Editor/Common/Fields/ControlledTextField.tsx b/frontend/components/Dashboard/Editor/Common/Fields/ControlledTextField.tsx
@@ -15,7 +15,7 @@ import { ControlledFieldProps } from "."
 import { pulseAnimation } from ".."
 import { useCourseEditorData } from "../../Course/CourseEditorDataContext"
 import RevertButton from "/components/RevertButton"
-import { InfoTooltipWithLabel } from "/components/Tooltip"
+import { InfoTooltip } from "/components/Tooltip"
 import { useAnchor } from "/hooks/useAnchors"
 
 const TextFieldContainer = styled("div")`
@@ -88,7 +88,7 @@ function ControlledTextFieldComponent<
                 onRevert={onRevert}
               />
             )}
-            {tip && <InfoTooltipWithLabel label={label} title={tip} />}
+            {tip && <InfoTooltip label={label} title={tip} />}
           </InputAdornment>
         ) : null,
     }),

diff --git a/frontend/components/Dashboard/Editor/Course/CourseInstanceLanguageSelector.tsx b/frontend/components/Dashboard/Editor/Course/CourseInstanceLanguageSelector.tsx
@@ -14,7 +14,7 @@ import { useEventCallback } from "@mui/material/utils"
 import { useCourseEditorData } from "./CourseEditorDataContext"
 import { CourseFormValues } from "./types"
 import RevertButton from "/components/RevertButton"
-import { InfoTooltipWithLabel } from "/components/Tooltip"
+import { InfoTooltip } from "/components/Tooltip"
 import { useAnchor } from "/hooks/useAnchors"
 import { useTranslator } from "/hooks/useTranslator"
 import CommonTranslations from "/translations/common"
@@ -134,7 +134,7 @@ function CourseInstanceLanguageSelector(
                   }
                   onRevert={onRevert}
                 />
-                <InfoTooltipWithLabel
+                <InfoTooltip
                   label={t("courseInstanceLanguage")}
                   title={t("helpCourseInstanceLanguage")}
                 />

diff --git a/frontend/components/NewLayout/Common/Card/index.tsx b/frontend/components/NewLayout/Common/Card/index.tsx
@@ -1,8 +1,7 @@
 import Image from "next/image"
 
 import { Typography, TypographyProps } from "@mui/material"
-import { css } from "@mui/material/styles"
-import { styled } from "@mui/material/styles"
+import { css, styled } from "@mui/material/styles"
 
 export const CardWrapper = styled("div")`
   border-radius: 4px;