Fix image loading

packages/login/.eslintcache

@@ -1 +0,0 @@
-[{"/Users/pveiga/repos/wisemapping-react/packages/login/src/RegistrationPage.jsx":"1","/Users/pveiga/repos/wisemapping-react/packages/login/src/Footer.jsx":"2","/Users/pveiga/repos/wisemapping-react/packages/login/src/Header.jsx":"3","/Users/pveiga/repos/wisemapping-react/packages/login/src/app.jsx":"4"},{"size":4567,"mtime":1607202547832,"results":"5","hashOfConfig":"6"},{"size":1515,"mtime":1607202547831,"results":"7","hashOfConfig":"6"},{"size":1748,"mtime":1607203815565,"results":"8","hashOfConfig":"6"},{"size":1538,"mtime":1607203354282,"results":"9","hashOfConfig":"6"},{"filePath":"10","messages":"11","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},"x74tgq",{"filePath":"12","messages":"13","errorCount":0,"warningCount":1,"fixableErrorCount":0,"fixableWarningCount":0,"source":"14"},{"filePath":"15","messages":"16","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"17","messages":"18","errorCount":0,"warningCount":2,"fixableErrorCount":0,"fixableWarningCount":0,"source":null},"/Users/pveiga/repos/wisemapping-react/packages/login/src/RegistrationPage.jsx",[],"/Users/pveiga/repos/wisemapping-react/packages/login/src/Footer.jsx",["19"],"import React from 'react';\nimport { FormattedMessage } from 'react-intl'\nimport { ReactComponent as SvgLogo } from './images/logo-text.svg'\n\nclass Footer extends React.Component {\n  render() {\n    return (\n      <footer className=\"footer\" >\n        {/* FIXME: we have to unify the way we load SVGs <Logo />*/}\n        <div >\n          <div><a href=\"termsofuse.html\"> <FormattedMessage id=\"footer.termsandconditions\" defaultMessage=\"Term And Conditions\" /> </a></div>\n          <div><a href=\"faq.html\"> <FormattedMessage id=\"footer.faq\" defaultMessage=\"F.A.Q.\"/> </a></div >\n          <div><a href=\"aboutus.html\"> <FormattedMessage id=\"footer.aboutus\" defaultMessage=\"About Us\" /></a></div >\n        </div>\n        <div >\n          <div><a href=\"http://www.wisemapping.org/\"> <FormattedMessage id=\"footer.opensource\" defaultMessage=\"Open Source\" /> </a></div>\n          <div><a href=\"mailto:team@wisemapping.com\"> <FormattedMessage id=\"footer.contactus\" defaultMessage=\"Contact Us\" /> </a></div>\n          <div>< a href=\"mailto:feedback@wisemapping.com\" > <FormattedMessage id=\"footer.feedback\" defaultMessage=\"Feedback\" /> </a></div>\n        </div>\n        <div>\n          <div><span className=\"button-style2\" >< a href=\"https://www.paypal.com/webapps/shoppingcart?flowlogging_id=c7ac923b53025&mfid=1606520600355_c7ac923b53025#/checkout/openButton\">< FormattedMessage id=\"footer.donations\" defaultMessage=\"PayPal Donations\" /> </a></span ></div>\n        </div >\n      </footer>\n    )\n  };\n}\n\nexport default Footer;\n","/Users/pveiga/repos/wisemapping-react/packages/login/src/Header.jsx",[],"/Users/pveiga/repos/wisemapping-react/packages/login/src/app.jsx",["20","21"],{"ruleId":"22","severity":1,"message":"23","line":3,"column":28,"nodeType":"24","messageId":"25","endLine":3,"endColumn":35},{"ruleId":"22","severity":1,"message":"26","line":10,"column":3,"nodeType":"24","messageId":"25","endLine":10,"endColumn":16},{"ruleId":"27","severity":1,"message":"28","line":41,"column":6,"nodeType":"29","endLine":41,"endColumn":8,"suggestions":"30"},"no-unused-vars","'SvgLogo' is defined but never used.","Identifier","unusedVar","'useRouteMatch' is defined but never used.","react-hooks/exhaustive-deps","React Hook useEffect has a missing dependency: 'locale'. Either include it or remove the dependency array.","ArrayExpression",["31"],{"desc":"32","fix":"33"},"Update the dependencies array to be: [locale]",{"range":"34","text":"35"},[946,948],"[locale]"]

packages/login/src/@types/index.d.ts

@@ -0,0 +1,3 @@
+declare module 'react-recaptcha-v3';
+declare module '*.png';
+

packages/login/src/@types/typings.d.ts

@@ -0,0 +1,6 @@
+declare module '*.jpeg';
+declare module '*.jpg';
+declare module '*.jpeg';
+declare module '*.png';
+declare module '*.svg';
+declare module '*.json';

packages/login/src/components/Footer.tsx

@@ -1,11 +1,13 @@
 import React from 'react';
 import { FormattedMessage } from 'react-intl'
-// import { ReactComponent as SvgLogo } from './images/logo-text.svg'
+
+const logo = require('../images/logo-text.svg')
+
 
 const Footer = () => {
   return (
     <footer className="footer" >
-      {/* FIXME: we have to unify the way we load SVGs <Logo />*/}
+      <img src={logo} alt="logo"/>
       <div >
         <div><a href="termsofuse.html"> <FormattedMessage id="footer.termsandconditions" defaultMessage="Term And Conditions" /> </a></div>
         <div><a href="faq.html"> <FormattedMessage id="footer.faq" defaultMessage="F.A.Q." /> </a></div >

packages/login/src/components/Header.tsx

@@ -1,7 +1,7 @@
 import React from 'react';
 import { FormattedMessage } from 'react-intl'
 
-//const logo = require('../images/header-logo.png')
+const logo = require('../images/header-logo.png')
 
 interface HeaderProps {
   type: string;
@@ -33,7 +33,7 @@ class Header extends React.Component<HeaderProps, HeaderProps> {
     return (
       <nav>
         <div className="header">
-          <span className="header-logo"><a href="/"><img src={"logo"} alt="logo" /></a></span>
+          <span className="header-logo"><a href="/"><img src={String(logo)} alt="logo" /></a></span>
           {text}
           {signUpButton}
           {signInButton}

packages/login/src/react-recaptcha-v3.d.ts

@@ -1 +0,0 @@
-declare module 'react-recaptcha-v3';

packages/login/webpack.config.js

@@ -25,6 +25,15 @@ module.exports = {
                 test: /\.css$/,
                 use: ["style-loader", "css-loader"]
 
+            },
+            {
+                test: /\.(png|jpe?g|gif|svg)$/,
+                use: [{
+                    loader: 'file-loader',
+                    options: {
+                        esModule: false,
+                    }
+                }, ],
             }
         ]
     },