Skip to content

Step one middelware #6

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 2 commits into
base: main
Choose a base branch
from
Open

Step one middelware #6

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
f851ac5
Roll back click changes after merging updtes
chuckmeyer Mar 24, 2023
176b8e6
Move search to utility func + env config
chuckmeyer Mar 27, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
5 changes: 2 additions & 3 deletions src/components/Hit.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,10 +5,10 @@ import {
Highlight,
} from 'react-instantsearch-hooks-web';

export default function Hit({hit, sendEvent}) {
export default function Hit({hit}) {
return (
<article>
<Link to={`card/${hit.objectID}`} onClick={()=>sendEvent('click', hit, 'Card Clicked')}>
<Link to={`card/${hit.objectID}`} >
<img
className="card"
src={hit.images.small}
Expand All @@ -28,6 +28,5 @@ export default function Hit({hit, sendEvent}) {

Hit.propTypes = {
hit: PropTypes.object.isRequired,
sendEvent: PropTypes.func.isRequired,
};

8 changes: 3 additions & 5 deletions src/components/Search.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
import React from 'react';
import algoliasearch from 'algoliasearch/lite';
import { searchClient, indexName } from '../utilities/algolia';
import {
Configure,
Hits,
Expand All @@ -13,21 +13,19 @@ import { Panel } from './Panel';
import Header from './Header';
import Hit from './Hit';

const searchClient = algoliasearch('OKF83BFQS4', '2ee1381ed11d3fe70b60605b1e2cd3f4');

export default function Search() {
return (
<div>
<Header />
<div className="container">
<InstantSearch
searchClient={searchClient}
indexName="pokemon-cards"
indexName={indexName}
routing={true}
>
<InsightsMiddleware />
<Configure
hitsPerPage={12}
hitsPerPage={12}
/>
<div className="search-panel">
<div className="search-panel__filters">
Expand Down
8 changes: 2 additions & 6 deletions src/effects/usePokemonData.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,11 +1,7 @@
import algoliasearch from "algoliasearch";
import { searchClient, indexName } from '../utilities/algolia';
import { useEffect, useState } from "react";

const searchClient = algoliasearch(
"OKF83BFQS4",
"2ee1381ed11d3fe70b60605b1e2cd3f4"
);
const index = searchClient.initIndex("pokemon-cards");
const index = searchClient.initIndex(indexName);

export const usePokemonData = (cardId) => {
const [pokemonData, setPokemonData] = useState({
Expand Down
7 changes: 7 additions & 0 deletions src/utilities/algolia.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,7 @@
import algoliasearch from 'algoliasearch'

export const appId = process.env.REACT_APP_ALGOLIA_APP_ID || ''
export const appKey = process.env.REACT_APP_ALGOLIA_API_KEY || ''
export const indexName = process.env.REACT_APP_ALGOLIA_INDEX_NAME || ''
export const userToken = process.env.REACT_APP_USER_TOKEN || ''
export const searchClient = algoliasearch(appId, appKey)