Renamed tooltip dependencies

Author: Zaydek Michels-Gualtieri

src/EditorApp/EditorApp.js

@@ -10,7 +10,7 @@ import usePreferences from "./usePreferences"
 
 import {
 	Editor,
-	useEditor,
+	useEditor
 } from "Editor"
 
 const App = () => {

src/EditorApp/MemoFixedBottomWYSIWYGMenu/WYSIWYGMenu.js

@@ -1,7 +1,7 @@
 import DispatchContext from "../DispatchContext"
 import React from "react"
 import userAgent from "lib/Client/userAgent"
-import { AbsoluteTopTooltip as Tooltip } from "../Tooltips"
+import { TopTooltip as Tooltip } from "../Tooltips"
 
 const WYSIWYGMenu = ({ rangeTypes }) => {
 	const dispatch = React.useContext(DispatchContext)

src/EditorApp/MemoFixedTopPreferences/MemoFixedTopPreferences.js

@@ -4,8 +4,11 @@ import React from "react"
 import Releases from "./Releases"
 import tabSize from "lib/x/tabSize"
 import Transition from "lib/x/Transition"
-import { AbsoluteBottomLeftToolTip as LeftTooltip } from "../Tooltips"
-import { AbsoluteBottomRightToolTip as RightTooltip } from "../Tooltips"
+
+import {
+	BottomLHSTooltip,
+	BottomRHSTooltip,
+} from "../Tooltips"
 
 const MemoFixedTopPreferences = React.memo(({ prefs }) => {
 	const dispatch = React.useContext(PrefsDispatchContext)
@@ -35,11 +38,11 @@ const MemoFixedTopPreferences = React.memo(({ prefs }) => {
 						}}
 					>
 						{(!prefs.show && tooltip === "lock") && (
-							<LeftTooltip>
+							<BottomLHSTooltip>
 								<p className="text-xs whitespace-pre text-gray-100">
 									{!prefs.readOnlyMode ? "Enable Read-Only Mode" : "Disable Read-Only Mode"}
 								</p>
-							</LeftTooltip>
+							</BottomLHSTooltip>
 						)}
 						<svg className="w-5 h-5" fill="currentColor" viewBox="0 0 20 20">
 							{!prefs.readOnlyMode
@@ -68,11 +71,11 @@ const MemoFixedTopPreferences = React.memo(({ prefs }) => {
 						}}
 					>
 						{(!prefs.show && tooltip === "releases") && (
-							<RightTooltip>
+							<BottomRHSTooltip>
 								<p className="text-xs whitespace-pre text-gray-100">
 									View Releases
 								</p>
-							</RightTooltip>
+							</BottomRHSTooltip>
 						)}
 						<svg className="w-5 h-5" fill="currentColor" viewBox="0 0 20 20">
 							<path d="M18 3a1 1 0 00-1.447-.894L8.763 6H5a3 3 0 000 6h.28l1.771 5.316A1 1 0 008 18h1a1 1 0 001-1v-4.382l6.553 3.276A1 1 0 0018 15V3z" clipRule="evenodd" fillRule="evenodd" />
@@ -93,11 +96,11 @@ const MemoFixedTopPreferences = React.memo(({ prefs }) => {
 						}}
 					>
 						{(!prefs.show && tooltip === "markdown") && (
-							<RightTooltip>
+							<BottomRHSTooltip>
 								<p className="text-xs whitespace-pre text-gray-100">
 									Render to GitHub Flavored Markdown
 								</p>
-							</RightTooltip>
+							</BottomRHSTooltip>
 						)}
 						<svg className="w-5 h-5" fill="currentColor" viewBox="0 0 20 20">
 							<path d="M2 5a2 2 0 012-2h12a2 2 0 012 2v10a2 2 0 01-2 2H4a2 2 0 01-2-2V5zm3.293 1.293a1 1 0 011.414 0l3 3a1 1 0 010 1.414l-3 3a1 1 0 01-1.414-1.414L7.586 10 5.293 7.707a1 1 0 010-1.414zM11 12a1 1 0 100 2h3a1 1 0 100-2h-3z" clipRule="evenodd" fillRule="evenodd" />
@@ -118,11 +121,11 @@ const MemoFixedTopPreferences = React.memo(({ prefs }) => {
 						}}
 					>
 						{(!prefs.show && tooltip === "markup") && (
-							<RightTooltip>
+							<BottomRHSTooltip>
 								<p className="text-xs whitespace-pre text-gray-100">
 									Render to HTML
 								</p>
-							</RightTooltip>
+							</BottomRHSTooltip>
 						)}
 						<svg className="w-5 h-5" fill="currentColor" viewBox="0 0 20 20">
 							<path d="M12.316 3.051a1 1 0 01.633 1.265l-4 12a1 1 0 11-1.898-.632l4-12a1 1 0 011.265-.633zM5.707 6.293a1 1 0 010 1.414L3.414 10l2.293 2.293a1 1 0 11-1.414 1.414l-3-3a1 1 0 010-1.414l3-3a1 1 0 011.414 0zm8.586 0a1 1 0 011.414 0l3 3a1 1 0 010 1.414l-3 3a1 1 0 11-1.414-1.414L16.586 10l-2.293-2.293a1 1 0 010-1.414z" clipRule="evenodd" fillRule="evenodd" />

src/EditorApp/Tooltips.js

@@ -1,6 +1,6 @@
 import React from "react"
 
-export const AbsoluteTopTooltip = ({ children }) => (
+export const TopTooltip = ({ children }) => (
 	<div className="absolute bottom-full" style={{ left: "50%" }}>
 		<div className="px-2 py-1 relative bg-gray-800 rounded shadow" style={{ left: "-50%" }}>
 			<div className="absolute bottom-0 inset-x-0 flex flex-row justify-center">
@@ -11,7 +11,7 @@ export const AbsoluteTopTooltip = ({ children }) => (
 	</div>
 )
 
-export const AbsoluteBottomLeftToolTip = ({ children }) => (
+export const BottomLHSTooltip = ({ children }) => (
 	<div className="absolute top-full left-0">
 		<div className="px-2 py-1 bg-gray-800 rounded shadow">
 			<div className="absolute top-0 left-0">
@@ -22,7 +22,7 @@ export const AbsoluteBottomLeftToolTip = ({ children }) => (
 	</div>
 )
 
-export const AbsoluteBottomRightToolTip = ({ children }) => (
+export const BottomRHSTooltip = ({ children }) => (
 	<div className="absolute top-full right-0">
 		<div className="px-2 py-1 bg-gray-800 rounded shadow">
 			<div className="absolute top-0 right-0">