diff --git a/frontend/src/components/SearchPage.tsx b/frontend/src/components/SearchPage.tsx
index 186196e6516764d263b43f76369ac017c84706a0..59b515032b25a8bcc906d6cff8e90862750796dc 100644
--- a/frontend/src/components/SearchPage.tsx
+++ b/frontend/src/components/SearchPage.tsx
@@ -1,6 +1,7 @@
 import { AudioOutlined } from '@ant-design/icons';
 import { Card, Input, List, Space, Table, Typography } from 'antd';
 import React, { useState } from 'react';
+import { Link } from 'react-router-dom';
 import { cardsDataExample } from './Preview';
 
 const { Search } = Input;
@@ -56,7 +57,7 @@ export const SearchPage = () => {
   const columns = [{
     title: 'Name',
     dataIndex: 'name',
-    render: (text: string | number | boolean | React.ReactElement<any, string | React.JSXElementConstructor<any>> | React.ReactFragment | React.ReactPortal | null | undefined) => <a href="#">{text}</a>,
+    render: ( text: string, record: MovieIO) => <Link to={`/movie/${record.id}`}><a>{record.name}</a></Link>,
   }, {
     title: 'Original name',
     className: 'original-name',
@@ -86,7 +87,7 @@ export const SearchPage = () => {
     {pressed && <Space direction="vertical" style={{ display: 'flex', padding: 24, textAlign: 'left' }}>
       <Table
       onRow={(record, rowIndex) => {
-        return{onClick: event => {console.log(record.id)} } //here change to view movie
+        return{onClick: event => {console.log(record.id);} } //here change to view movie
       }}
     columns={columns}
     dataSource={resultsExample}