mirror of
https://github.com/pds-nest/nest.git
synced 2024-11-22 04:54:18 +00:00
💥 Refactor some more...
This commit is contained in:
parent
9c0356c8e4
commit
c9cf2a1142
9 changed files with 38 additions and 28 deletions
|
@ -1,7 +1,7 @@
|
||||||
import React from "react"
|
import React from "react"
|
||||||
import Style from "./Button.module.css"
|
import Style from "./Button.module.css"
|
||||||
import classNames from "classnames"
|
import classNames from "classnames"
|
||||||
import make_icon from "../../utils/make_icon"
|
import makeIcon from "../../utils/makeIcon"
|
||||||
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
|
@ -26,7 +26,7 @@ export default function Button({ children, disabled, onClick, className, color,
|
||||||
disabled={disabled}
|
disabled={disabled}
|
||||||
{...props}
|
{...props}
|
||||||
>
|
>
|
||||||
{children} {make_icon(icon, Style.Icon)}
|
{children} {makeIcon(icon, {className: Style.Icon})}
|
||||||
</button>
|
</button>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,7 +1,7 @@
|
||||||
import React from "react"
|
import React from "react"
|
||||||
import Style from "./ButtonSidebar.module.css"
|
import Style from "./ButtonSidebar.module.css"
|
||||||
import classNames from "classnames"
|
import classNames from "classnames"
|
||||||
import make_icon from "../../utils/make_icon"
|
import makeIcon from "../../utils/makeIcon"
|
||||||
import { Link } from "react-router-dom"
|
import { Link } from "react-router-dom"
|
||||||
import { useRouteMatch } from "react-router"
|
import { useRouteMatch } from "react-router"
|
||||||
|
|
||||||
|
@ -31,7 +31,7 @@ export default function ButtonSidebar({ icon, children, to, className, ...props
|
||||||
return (
|
return (
|
||||||
<Link to={to} className={Style.ButtonLink}>
|
<Link to={to} className={Style.ButtonLink}>
|
||||||
<div className={classNames(Style.ButtonSidebar, "Clickable", className)} {...props}>
|
<div className={classNames(Style.ButtonSidebar, "Clickable", className)} {...props}>
|
||||||
{make_icon(icon, Style.ButtonIcon)}
|
{makeIcon(icon, {className: Style.ButtonIcon})}
|
||||||
<div className={Style.ButtonText}>
|
<div className={Style.ButtonText}>
|
||||||
{children}
|
{children}
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -1,7 +1,7 @@
|
||||||
import React, { useState } from "react"
|
import React, { useState } from "react"
|
||||||
import Style from "./InputWithIcon.module.css"
|
import Style from "./InputWithIcon.module.css"
|
||||||
import classNames from "classnames"
|
import classNames from "classnames"
|
||||||
import make_icon from "../../utils/make_icon"
|
import makeIcon from "../../utils/makeIcon"
|
||||||
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
|
@ -22,7 +22,7 @@ export default function InputWithIcon({ icon, className, ...props }) {
|
||||||
return (
|
return (
|
||||||
<div className={classNames(Style.InputWithIcon, isFocused ? Style.Focused : null, className)}>
|
<div className={classNames(Style.InputWithIcon, isFocused ? Style.Focused : null, className)}>
|
||||||
<div className={Style.IconPart}>
|
<div className={Style.IconPart}>
|
||||||
{make_icon(icon)}
|
{makeIcon(icon)}
|
||||||
</div>
|
</div>
|
||||||
<input
|
<input
|
||||||
className={Style.InputPart}
|
className={Style.InputPart}
|
||||||
|
|
|
@ -1,7 +1,7 @@
|
||||||
import isString from "is-string"
|
import isString from "is-string"
|
||||||
|
|
||||||
|
|
||||||
export default function makeURLSearchParams(obj) {
|
URLSearchParams.fromSerializableObject = function(obj) {
|
||||||
let usp = new URLSearchParams()
|
let usp = new URLSearchParams()
|
||||||
for(const key in obj) {
|
for(const key in obj) {
|
||||||
if(!obj.hasOwnProperty(key)) {
|
if(!obj.hasOwnProperty(key)) {
|
3
nest_frontend/prototypes/index.js
vendored
3
nest_frontend/prototypes/index.js
vendored
|
@ -1 +1,2 @@
|
||||||
import "./Date"
|
import "./Date"
|
||||||
|
import "./URLSearchParams"
|
||||||
|
|
|
@ -1,2 +0,0 @@
|
||||||
export const DEFAULT_MAP_CENTER = { lat: 0, lng: 0 }
|
|
||||||
export const DEFAULT_MAP_ZOOM = 3
|
|
|
@ -4,7 +4,6 @@
|
||||||
* @param func - The function to decorate.
|
* @param func - The function to decorate.
|
||||||
* @param history - The history to push the destination to.
|
* @param history - The history to push the destination to.
|
||||||
* @param destination - The path of the destination.
|
* @param destination - The path of the destination.
|
||||||
* @returns {(function(): void)|*}
|
|
||||||
*/
|
*/
|
||||||
export default function goToOnSuccess(func, history, destination) {
|
export default function goToOnSuccess(func, history, destination) {
|
||||||
return async (...args) => {
|
return async (...args) => {
|
||||||
|
|
29
nest_frontend/utils/makeIcon.js
Normal file
29
nest_frontend/utils/makeIcon.js
Normal file
|
@ -0,0 +1,29 @@
|
||||||
|
import React, { isValidElement } from "react"
|
||||||
|
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"
|
||||||
|
import {IconDefinition} from "@fortawesome/fontawesome-svg-core"
|
||||||
|
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Try to create an icon element based on what is passed to the function:
|
||||||
|
* - If a {@link JSX.Element} is passed, a `<span>` element containing it will be created and returned.
|
||||||
|
* - If a {@link IconDefinition} is passed, a `<span>` element containing a {@link FontAwesomeIcon} will be created
|
||||||
|
* and returned.
|
||||||
|
* - If a falsy value is passed, `null` will be returned.
|
||||||
|
*
|
||||||
|
* @param icon - The icon value.
|
||||||
|
* @param props - Props to pass to the span element when it is created.
|
||||||
|
* @returns {JSX.Element|null}
|
||||||
|
*/
|
||||||
|
export default function makeIcon(icon, props) {
|
||||||
|
if(isValidElement(icon)) {
|
||||||
|
return <span {...props}>{icon}</span>
|
||||||
|
}
|
||||||
|
else if(icon) {
|
||||||
|
return (
|
||||||
|
<span {...props}><FontAwesomeIcon icon={icon}/></span>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
else {
|
||||||
|
return null
|
||||||
|
}
|
||||||
|
}
|
|
@ -1,17 +0,0 @@
|
||||||
import React, { isValidElement } from "react"
|
|
||||||
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"
|
|
||||||
|
|
||||||
|
|
||||||
export default function make_icon(icon, className) {
|
|
||||||
if(isValidElement(icon)) {
|
|
||||||
return <span className={className}>icon</span>
|
|
||||||
}
|
|
||||||
else if(icon) {
|
|
||||||
return (
|
|
||||||
<span className={className}><FontAwesomeIcon icon={icon}/></span>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
else {
|
|
||||||
return null
|
|
||||||
}
|
|
||||||
}
|
|
Loading…
Reference in a new issue