Skip to content

Commit

Permalink
feat: limit capture-match request to one capture at a time
Browse files Browse the repository at this point in the history
  • Loading branch information
@gwynndp
gwynndp committed Jan 30, 2022
1 parent a560728 commit c41ae35
Show file tree
Hide file tree
Showing 5 changed files with 106 additions and 123 deletions.
9 changes: 4 additions & 5 deletions .env.development
View file
Original file line number Diff line number Diff line change
@@ -1,13 +1,12 @@
REACT_APP_WEBMAP_DOMAIN=http://dev.treetracker.org
REACT_APP_API_ROOT=https://dev-k8s.treetracker.org/api/admin
REACT_APP_EARNINGS_ROOT=https://dev-k8s.treetracker.org/earnings
REACT_APP_MESSAGING_ROOT=https://dev-k8s.treetracker.org/messaging
REACT_APP_QUERY_API_ROOT=https://dev-k8s.treetracker.org/query
REACT_APP_REPORTING_API_ROOT=https://dev-k8s.treetracker.org/reporting
REACT_APP_TREETRACKER_API_ROOT=https://dev-k8s.treetracker.org/treetracker
REACT_APP_ENABLE_CAPTURE_MATCHING=true
REACT_APP_REPORTING_API_ROOT=https://dev-k8s.treetracker.org/reporting
REACT_APP_REPORTING_ENABLED=true
REACT_APP_ENABLE_EARNINGS=true
REACT_APP_ENABLE_PAYMENTS=true
REACT_APP_ENABLE_MESSAGING=true
REACT_APP_API_URL=https://dev-k8s.treetracker.org
REACT_APP_EARNINGS_API_MAPPING=/earnings
REACT_APP_QUERY_API_ROOT=https://dev-k8s.treetracker.org/query
REACT_APP_REPORTING_ENABLED=true
11 changes: 6 additions & 5 deletions src/api/apiUtils.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -25,9 +25,10 @@ export function handleError(error) {

// used for limiting organization access, NOT filtering by org/sub-orgs
export function getOrganization() {
if (session.user?.policy?.organization?.id) {
return `organization/${session.user?.policy?.organization?.id}/`;
} else {
return '';
}
const orgId = getOrganizationId();
return orgId ? `organization/${orgId}/` : '';
}

export function getOrganizationId() {
return session.user?.policy?.organization?.id || null;
}
2 changes: 1 addition & 1 deletion src/api/earnings.js
View file
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
import axios from 'axios';
import { session } from '../models/auth';

const apiUrl = `${process.env.REACT_APP_API_URL}${process.env.REACT_APP_EARNINGS_API_MAPPING}`;
const apiUrl = `${process.env.REACT_APP_EARNINGS_ROOT}`;
const Axios = axios.create({ baseURL: apiUrl });

export default {
Expand Down
123 changes: 57 additions & 66 deletions src/components/CaptureMatching/CaptureImage.js
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import React from 'react';
import React, { useState, useEffect } from 'react';

import CaptureHeader from './CaptureHeader';
import Grower from './Grower';
Expand All @@ -11,12 +11,12 @@ import { makeStyles } from '@material-ui/core/styles';
import { getDateTimeStringLocale } from 'common/locale';

function Country({ lat, lon }) {
const [content, setContent] = React.useState('');
const [content, setContent] = useState('');
if (lat === 'undefined' || lon === 'undefined') {
setContent('No data');
}

React.useEffect(() => {
useEffect(() => {
setContent('loading...');
fetch(
`${process.env.REACT_APP_QUERY_API_ROOT}/countries?lat=${lat}&lon=${lon}`
Expand All @@ -35,10 +35,6 @@ function Country({ lat, lon }) {
.then((data) => {
setContent(data.countries[0].name);
});
// .catch(err => {
// console.error('e:', err);
// setContent('Unknown error');
// });
}, []);

return <span>{content}</span>;
Expand Down Expand Up @@ -98,7 +94,6 @@ function CaptureImage(props) {
currentPage,
noOfPages,
handleChange,
imgPerPage,
imgCount,
handleSkip,
} = props;
Expand All @@ -119,68 +114,64 @@ function CaptureImage(props) {
<Box height={16} />

{captureImages &&
captureImages
.slice((currentPage - 1) * imgPerPage, currentPage * imgPerPage)
.map((capture) => {
return (
<Paper
elevation={4}
key={`capture_${capture.id}`}
className={classes.containerBox}
>
<Box className={classes.headerBox}>
<Box className={classes.box2}>
<Tooltip title={capture.id}>
<Typography variant="h5">
Capture {(capture.id + '').substring(0, 10) + '...'}
</Typography>
</Tooltip>
<Box className={classes.box3}>
<AccessTimeIcon />
<Typography variant="body1">
{getDateTimeStringLocale(capture.created_at)}
</Typography>
</Box>

<Box className={classes.box3}>
<LocationOnOutlinedIcon />
<Typography variant="body1">
<Country lat={capture.lat} lon={capture.lon} />
</Typography>
</Box>
{/* <UseLocation/> */}
captureImages.map((capture) => {
return (
<Paper
elevation={4}
key={`capture_${capture.id}`}
className={classes.containerBox}
>
<Box className={classes.headerBox}>
<Box className={classes.box2}>
<Tooltip title={capture.id}>
<Typography variant="h5">
Capture {(capture.id + '').substring(0, 10) + '...'}
</Typography>
</Tooltip>
<Box className={classes.box3}>
<AccessTimeIcon />
<Typography variant="body1">
{getDateTimeStringLocale(capture.created_at)}
</Typography>
</Box>

<Grower
planter_photo_url={capture.planter_photo_url}
planter_username={capture.planter_username}
status={capture.status}
/>

<Button
variant="outlined"
color="primary"
onClick={handleSkip}
className={classes.button}
>
Skip
<SkipNextIcon />
</Button>
<Box className={classes.box3}>
<LocationOnOutlinedIcon />
<Typography variant="body1">
<Country lat={capture.lat} lon={capture.lon} />
</Typography>
</Box>
{/* <UseLocation/> */}
</Box>

<Box className={classes.imgBox}>
{/* {treeList.slice(0, 1).map( img => { */}

<img
key={capture.id}
className={classes.imgContainer}
src={capture.image_url}
alt={`Capture ${capture.id}`}
/>
</Box>
</Paper>
);
})}
<Grower
planter_photo_url={capture.planter_photo_url}
planter_username={capture.planter_username}
status={capture.status}
/>

<Button
variant="outlined"
color="primary"
onClick={handleSkip}
className={classes.button}
>
Skip
<SkipNextIcon />
</Button>
</Box>

<Box className={classes.imgBox}>
<img
key={capture.id}
className={classes.imgContainer}
src={capture.image_url}
alt={`Capture ${capture.id}`}
/>
</Box>
</Paper>
);
})}
</Box>
);
}
Expand Down
84 changes: 38 additions & 46 deletions src/components/CaptureMatching/CaptureMatchingView.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -54,55 +54,43 @@ function CaptureMatchingView() {
// const treesCount = candidateImgData.length;
const treeIcon = <NatureOutlinedIcon className={classes.candidateImgIcon} />;

useEffect(() => {
console.log('loading candidate images');
async function fetchCandidateTrees(captureId) {
// TODO: handle errors and give user feedback
setLoading(true);
const data = await fetch(
`${CAPTURE_API}/trees/potential_matches?capture_id=${captureId}`,
{
headers: {
// Authorization: session.token,
},
}
).then((res) => res.json());
console.log('candidate images ---> ', data);
setCandidateImgData(data.matches);
setTreesCount(data.matches.length);
setLoading(false);
}

// setCandidateImgData([]);

if (
captureImages &&
currentPage > 0 &&
currentPage <= captureImages.length
) {
const captureId = captureImages[currentPage - 1].id;
console.log('captureId', captureId);
if (captureId) {
fetchCandidateTrees(captureId);
async function fetchCandidateTrees(captureId) {
// TODO: handle errors and give user feedback
setLoading(true);
const data = await fetch(
`${CAPTURE_API}/trees/potential_matches?capture_id=${captureId}`,
{
headers: {
// Authorization: session.token,
},
}
}
}, [currentPage, captureImages]);
).then((res) => res.json());
setCandidateImgData(data.matches);
setTreesCount(data.matches.length);
setLoading(false);
}

useEffect(() => {
console.log('loading captures');
async function fetchCaptures() {
// TODO: handle errors and give user feedback
setLoading(true);
const data = await fetch(`${CAPTURE_API}/captures`, {
async function fetchCaptures(currentPage) {
// TODO: handle errors and give user feedback
setLoading(true);
const data = await fetch(
`${CAPTURE_API}/captures?limit=${1}&offset=${currentPage - 1}`,
{
headers: {
// Authorization: session.token,
},
}).then((res) => res.json());
setCaptureImages(data);
setLoading(false);
}
fetchCaptures();
}, []);
}
).then((res) => res.json());
setCaptureImages(data.captures);
setNoOfPages(data.count);
setImgCount(data.count);
setLoading(false);
}

useEffect(() => {
console.log('loading captures', currentPage);
fetchCaptures(currentPage);
}, [currentPage]);

useEffect(() => {
if (currentPage <= 0 || currentPage > noOfPages) {
Expand All @@ -111,8 +99,12 @@ function CaptureMatchingView() {
}, [noOfPages, currentPage]);

useEffect(() => {
setNoOfPages(captureImages.length);
setImgCount(captureImages.length);
if (captureImages.length) {
console.log('loading candidate images');
const captureId = captureImages[0].id;
console.log('captureId', captureId);
fetchCandidateTrees(captureId);
}
}, [captureImages]);

// Capture Image Pagination function
Expand Down

0 comments on commit c41ae35

Please sign in to comment.