diff --git a/client/src/components/Apps/AppCard/AppCard.tsx b/client/src/components/Apps/AppCard/AppCard.tsx index dbd17e6..2fe3b21 100644 --- a/client/src/components/Apps/AppCard/AppCard.tsx +++ b/client/src/components/Apps/AppCard/AppCard.tsx @@ -1,6 +1,6 @@ import classes from './AppCard.module.css'; import { Icon } from '../../UI'; -import { iconParser, urlParser } from '../../../utility'; +import { iconParser, isImage, isSvg, isUrl, urlParser } from '../../../utility'; import { App } from '../../../interfaces'; import { useSelector } from 'react-redux'; @@ -19,19 +19,23 @@ export const AppCard = (props: Props): JSX.Element => { let iconEl: JSX.Element; const { icon } = props.app; - if (/.(jpeg|jpg|png)$/i.test(icon)) { + if (isImage(icon)) { + const source = isUrl(icon) ? icon : `/uploads/${icon}`; + iconEl = ( {`${props.app.name} ); - } else if (/.(svg)$/i.test(icon)) { + } else if (isSvg(icon)) { + const source = isUrl(icon) ? icon : `/uploads/${icon}`; + iconEl = (
diff --git a/client/src/components/Bookmarks/BookmarkCard/BookmarkCard.tsx b/client/src/components/Bookmarks/BookmarkCard/BookmarkCard.tsx index f3b3bd3..146bf67 100644 --- a/client/src/components/Bookmarks/BookmarkCard/BookmarkCard.tsx +++ b/client/src/components/Bookmarks/BookmarkCard/BookmarkCard.tsx @@ -9,7 +9,7 @@ import classes from './BookmarkCard.module.css'; import { Icon } from '../../UI'; -import { iconParser, urlParser } from '../../../utility'; +import { iconParser, isImage, isSvg, isUrl, urlParser } from '../../../utility'; interface Props { category: Category; @@ -30,21 +30,25 @@ export const BookmarkCard = (props: Props): JSX.Element => { if (bookmark.icon) { const { icon, name } = bookmark; - if (/.(jpeg|jpg|png)$/i.test(icon)) { + if (isImage(icon)) { + const source = isUrl(icon) ? icon : `/uploads/${icon}`; + iconEl = (
{`${name}
); - } else if (/.(svg)$/i.test(icon)) { + } else if (isSvg(icon)) { + const source = isUrl(icon) ? icon : `/uploads/${icon}`; + iconEl = (
diff --git a/client/src/utility/index.ts b/client/src/utility/index.ts index 9047d07..6afc05c 100644 --- a/client/src/utility/index.ts +++ b/client/src/utility/index.ts @@ -7,3 +7,4 @@ export * from './redirectUrl'; export * from './templateObjects'; export * from './inputHandler'; export * from './storeUIConfig'; +export * from './validators'; diff --git a/client/src/utility/searchParser.ts b/client/src/utility/searchParser.ts index cff9bfb..82ce28c 100644 --- a/client/src/utility/searchParser.ts +++ b/client/src/utility/searchParser.ts @@ -1,6 +1,7 @@ import { queries } from './searchQueries.json'; import { Query, SearchResult } from '../interfaces'; import { store } from '../store/store'; +import { isUrlOrIp } from '.'; export const searchParser = (searchQuery: string): SearchResult => { const result: SearchResult = { @@ -18,10 +19,7 @@ export const searchParser = (searchQuery: string): SearchResult => { const { customQueries, config } = store.getState().config; // Check if url or ip was passed - const urlRegex = - /^(http:\/\/www\.|https:\/\/www\.|http:\/\/|https:\/\/)?[a-z0-9]+([\-\.]{1}[a-z0-9]+)*\.[a-z]{2,5}(:[0-9]{1,5})?(\/.*)?|^((http:\/\/www\.|https:\/\/www\.|http:\/\/|https:\/\/)?([0-9]|[1-9][0-9]|1[0-9]{2}|2[0-4][0-9]|25[0-5])\.){3}([0-9]|[1-9][0-9]|1[0-9]{2}|2[0-4][0-9]|25[0-5])$/i; - - result.isURL = urlRegex.test(searchQuery); + result.isURL = isUrlOrIp(searchQuery); // Match prefix and query const splitQuery = searchQuery.match(/^\/([a-z]+)[ ](.+)$/i); diff --git a/client/src/utility/validators.ts b/client/src/utility/validators.ts new file mode 100644 index 0000000..361da05 --- /dev/null +++ b/client/src/utility/validators.ts @@ -0,0 +1,25 @@ +export const isUrlOrIp = (data: string): boolean => { + const regex = + /^(http:\/\/www\.|https:\/\/www\.|http:\/\/|https:\/\/)?[a-z0-9]+([\-\.]{1}[a-z0-9]+)*\.[a-z]{2,5}(:[0-9]{1,5})?(\/.*)?|^((http:\/\/www\.|https:\/\/www\.|http:\/\/|https:\/\/)?([0-9]|[1-9][0-9]|1[0-9]{2}|2[0-4][0-9]|25[0-5])\.){3}([0-9]|[1-9][0-9]|1[0-9]{2}|2[0-4][0-9]|25[0-5])$/i; + + return regex.test(data); +}; + +export const isUrl = (data: string): boolean => { + const regex = + /(https?:\/\/(?:www\.|(?!www))[a-zA-Z0-9][a-zA-Z0-9-]+[a-zA-Z0-9]\.[^\s]{2,}|www\.[a-zA-Z0-9][a-zA-Z0-9-]+[a-zA-Z0-9]\.[^\s]{2,}|https?:\/\/(?:www\.|(?!www))[a-zA-Z0-9]+\.[^\s]{2,}|www\.[a-zA-Z0-9]+\.[^\s]{2,})/i; + + return regex.test(data); +}; + +export const isImage = (data: string): boolean => { + const regex = /.(jpeg|jpg|png)$/i; + + return regex.test(data); +}; + +export const isSvg = (data: string): boolean => { + const regex = /.(svg)$/i; + + return regex.test(data); +};