diff --git a/src/App.tsx b/src/App.tsx index c17b51ff..f6057948 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -5,14 +5,32 @@ import NoResults from './components/no-results'; import Header from './components/header'; import Preview from './components/preview'; import LoadingSkeleton from './components/loading-skeleton'; +import { ExceptionMessage } from "./types"; + +function isResponseIsAnException(response: ExceptionMessage) { + return response.code >= 0 && typeof response.message === 'string'; +} const App: FunctionalComponent = () => { - const [loading, setLoading] = useState(true); + const [isLoading, setLoading] = useState(true); + const [exceptionOnScrapperResult, setException] = useState(""); const [results, setResults] = useState([]); + const hasExceptions = Boolean(exceptionOnScrapperResult); + const showLoading = !hasExceptions && isLoading; + const showResults = !showLoading && results.length > 0; + const noResults = !showLoading && (!hasExceptions && results.length === 0); + useEffect(() => { chrome.runtime.sendMessage({ action: 'rows-x:scrap' }, (response) => { - setResults(response); + if (isResponseIsAnException(response)) { + setResults([]); + setException(response.message); + } else { + setResults(response); + setException(""); + } + setLoading(false); }); }, []); @@ -21,11 +39,10 @@ const App: FunctionalComponent = () => { <>
- {loading ? ( - - ) : ( - <>{results.length > 0 ? : } - )} + {showLoading && ()} + {showResults && } + {noResults && } + {hasExceptions && }
); diff --git a/src/background.ts b/src/background.ts index 9d5535fd..3c31530e 100644 --- a/src/background.ts +++ b/src/background.ts @@ -1,10 +1,21 @@ /* eslint-disable @typescript-eslint/no-non-null-assertion */ +import {ERROR_MESSAGES, ErrorCodes} from "./error-codes"; import { getCurrentTab, runScrapper } from './utils/chrome'; import { getScrapperOptionsByUrl } from './utils/scrapperUtils'; async function scrap() { const tab = await getCurrentTab(); - if (!tab || !tab.url || !tab.title) return; + + if (!tab || !tab.url || !tab.title) { + return; + } + + if (tab.url.includes('chrome://')) { + return { + code: ErrorCodes.GOOGLE_CHROME_INTERNAL_PAGES, + message: ERROR_MESSAGES.get(ErrorCodes.GOOGLE_CHROME_INTERNAL_PAGES) + }; + } const options = getScrapperOptionsByUrl(tab.url, tab.title); diff --git a/src/components/no-results.tsx b/src/components/no-results.tsx index e6585b96..d8364ac0 100644 --- a/src/components/no-results.tsx +++ b/src/components/no-results.tsx @@ -3,7 +3,11 @@ import './no-results.css'; import Button from './button'; import { getCurrentTab } from '../utils/chrome'; -const NoResults = (): JSX.Element => { +interface Props { + message?: string; +} + +const NoResults = ({ message }: Props): JSX.Element => { const redirectToFeedback = async () => { const tab = await getCurrentTab(); if (!tab || !tab.url) return; @@ -25,7 +29,7 @@ const NoResults = (): JSX.Element => {
No results - Would you like RowsX to support this website? + {message ?? 'Would you like RowsX to support this website?'}