Skip to content

Commit

Permalink
Merge pull request #259 from bounswe/mkuzu-ontwitter-tests
Browse files Browse the repository at this point in the history
Client code for on-twitter api with some additions
  • Loading branch information
mehmetkuzu authored Jun 4, 2023
2 parents 7a16a8b + d608557 commit d7566ec
Show file tree
Hide file tree
Showing 9 changed files with 1,324 additions and 37 deletions.
9 changes: 7 additions & 2 deletions practice-app/client/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -9,22 +9,27 @@
"lint": "next lint"
},
"dependencies": {
"@nextui-org/react": "^1.0.0-beta.13",
"@types/node": "18.15.11",
"@types/react": "18.0.37",
"@types/react-dom": "18.0.11",
"autoprefixer": "10.4.14",
"axios": "^1.4.0",
"bootstrap": "^5.3.0",
"eslint": "8.38.0",
"eslint-config-next": "13.3.0",
"firebase": "^9.21.0",
"formik": "^2.4.1",
"leaflet": "^1.9.3",
"next": "13.3.0",
"postcss": "8.4.22",
"react": "18.2.0",
"react-dom": "18.2.0",
"react-google-maps": "^9.4.5",
"react-leaflet": "^4.2.1",
"react-router-dom": "^6.11.2",
"tailwindcss": "3.3.1",
"typescript": "5.0.4"
"typescript": "5.0.4",
"yup": "^1.2.0"
}
}
}
45 changes: 40 additions & 5 deletions practice-app/client/pages/index.tsx
Original file line number Diff line number Diff line change
@@ -1,11 +1,46 @@
import dynamic from 'next/dynamic'
import {Table} from "@nextui-org/react";

function HomePage() {
const TimeZone = dynamic(
() => import('./timezone/timezone'), // replace '@components/map' with your component's location
{ ssr: false } // This line is important. It's what prevents server-side render
)
return <TimeZone />

return (
<div className="vh-100 d-flex flex-column justify-content-center align-items-center">
<h1> All forms</h1>

<p>
<a href="/alerts">Alerts </a>
</p>
<p>
<a href="/emailreport">E-mail report </a>
</p>
<p>
<a href="/filtersort">Filter sort </a>
</p>
<p>
<a href="/location">Location </a>
</p>
<p>
<a href="/login">Login </a>
</p>
<p>
<a href="/news">News </a>
</p>
<p>
<a href="/notifications">Notifications </a>
</p>
<p>
<a href="/registration">Registration </a>
</p>
<p>
<a href="/timezone">Timezone </a>
</p>
<p>
<a href="/on-twitter-listevents">Twitter API </a>
</p>

</div>
)

}

export default HomePage
255 changes: 255 additions & 0 deletions practice-app/client/pages/on-twitter-listevents/index.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,255 @@
'use client';
import {ReactDOM, useEffect} from 'react';

import {useState} from 'react';

import {useFormik} from 'formik';
import type {NextPage} from 'next';
import * as yup from 'yup';

import axios from 'axios';

import useStorage from "@/pages/useStorage";
import {Table} from '@nextui-org/react';
import {hydrateRoot} from "react-dom/client";
import {hydrate} from "next/client";

import 'bootstrap/dist/css/bootstrap.min.css';
import { Link } from 'react-router-dom';

const ListAllTweets: NextPage = () => {
const [message, setMessage] = useState(''); // This will be used to show a message if the submission is successful
const [submitted, setSubmitted] = useState(false);
let {getItem} = useStorage();
let usernameLogin = ""
let password = getItem("password");
let isDBA = getItem("isDBA");

let apiBaseURL = getItem("apiBaseURL");
let {setItem} = useStorage();

const [userTitle, setUser] = useState('Not logged in')
// During hydration `useEffect` is called. `window` is available in `useEffect`. In this case because we know we're in the browser checking for window is not needed. If you need to read something from window that is fine.
// By calling `setColor` in `useEffect` a render is triggered after hydrating, this causes the "browser specific" value to be available. In this case 'red'.
useEffect(() => setUser(getItem("username")), [])
useEffect(() => {
(async () => {
handleSubmit();
})()
}, [])

const columns = [
{
key: "event_date",
label: "Event Date",
align: 'right',
},
{
key: "event_summary",
label: "Event summary",
style: {whiteSpace: "normal"}
},
{
key: "related_twits",
label: "Related Tweets",
},
{
key: "verified",
label: "Verified",
},
{
key: "event_id",
label: "Event ID",
},
];

const [data, setData] = useState([]);
const handleSubmit2 = async (event: any) => {
event.preventDefault();
event.preventDefault();
let eventId = document.getElementsByName("eventid").values().next().value.value;
try {
let baseUrl = `${process.env.NEXT_PUBLIC_BACKEND_URL}/on-twitter/deletePublishedTweets/`;

let dataPart = `${eventId}`
baseUrl = `${baseUrl}${dataPart}`;

const response = await axios.get(baseUrl);

const result = JSON.stringify(response.data);
window.alert(`Tweets deleted for event: ${eventId}`)
handleSubmit()
// eslint-disable-next-line react-hooks/rules-of-hooks
} catch (err: any) {
if (typeof window !== "undefined") {
if (err.response.status == 404) {
window.alert("Event not found");
} else if (err.response.status == 418) {
window.alert("Cant'do - I'm a teapot");
} else
window.alert(err.response.status);
return;
}
}
}

const handleSubmit3 = async (event: any) => {
event.preventDefault();
let eventId = document.getElementsByName("eventid").values().next().value.value;
try {
let baseUrl = `${process.env.NEXT_PUBLIC_BACKEND_URL}/on-twitter/publishTweets/`;

let dataPart = `${eventId}`
baseUrl = `${baseUrl}${dataPart}`;

const response = await axios.post(baseUrl);

const result = JSON.stringify(response.data);
window.alert(`Tweets created for event: ${eventId}`)
handleSubmit()
// eslint-disable-next-line react-hooks/rules-of-hooks
} catch (err: any) {
if (typeof window !== "undefined") {
if (typeof window !== "undefined") {
if (err.response.status == 404) {
window.alert("Event not found");
} else if (err.response.status == 418) {
window.alert("Cant'do - I'm a teapot");
} else
window.alert(err.response.status);
return;
}
}
}
};

async function handleSubmit() {
try {
let baseUrl = `${process.env.NEXT_PUBLIC_BACKEND_URL}/on-twitter/getEvents`;

//let dataPart = `?eventId=`
baseUrl = `${baseUrl}`;
//baseUrl = `${baseUrl}${dataPart}`;

const response = await axios.get(baseUrl);

const result = JSON.stringify(response.data);
const eventsData = JSON.parse(result)["Events"];
if (eventsData != null) {
setData(eventsData);
}

// eslint-disable-next-line react-hooks/rules-of-hooks
} catch (err: any) {
if (typeof window !== "undefined") {
if (err.response.status == 401) {
window.alert("Not authorized for this");
} else
window.alert(err.response.status);
return;
}
}
};

const insertLinkIfNeeded = (columnKey:any, item:any) => {
if (columnKey == "related_twits") {
let arrTwits = item[columnKey];
let retValAll = [];
for (const eachTwit of arrTwits) {
let retval = "https://twitter.com/user/status/" + eachTwit;
retValAll.push(<div><a href={retval}>{eachTwit}</a></div>);
}
return retValAll;
} else if (columnKey == "event_summary") {
let arrSummaries = item[columnKey];
let retValAll = [];
let firstLine = true;
for (const summ of arrSummaries) {
let retval = summ;
if (firstLine) {
firstLine = false;
} else {
retval = "-> " + retval;
}

retValAll.push(<div>{retval}</div>);
}
return retValAll;
} else {
return item[columnKey];
}
}

return (
<div className="vh-100 d-flex flex-column justify-content-center align-items-center">
<div hidden={!submitted} className="alert alert-primary" role="alert">
{message}
</div>
<h1> All Events</h1>
<Table
id="EventsTable"
aria-label="Events"
css={{
height: "auto",
minWidth: "100%",
//whiteSpace: "normal",
}}
>
<Table.Header columns={columns}>
{(column) => (
<Table.Column key={column.key}>{column.label}</Table.Column>
)}
</Table.Header>
<Table.Body items={data}>
{(item) => (
<Table.Row key={item["key"]}>
{(columnKey) => <Table.Cell css={{
height: "auto",
minWidth: "100%",
//whiteSpace: "break-spaces",
}}
>{insertLinkIfNeeded(columnKey,item)}</Table.Cell>}
</Table.Row>
)}
</Table.Body>
</Table>
<form className="w-50" onSubmit={handleSubmit2}>
<div className="name block">
<div>
<label htmlFor="eventid" className="form-label">
Event ID
</label>
<input
type="text"
id="eventid"
name="eventid"
className="form-control"
placeholder=""
/>
<div>

<button type="submit" className="btn btn-primary" style={{
margin: "10px",
}}>
Delete twits for event
</button>

<button type="submit" className="btn btn-primary" style={{
margin: "10px",
}} onClick={handleSubmit3}>
Create twits for event
</button>

</div>
</div>
</div>
</form>
{/* eslint-disable-next-line @next/next/no-html-link-for-pages */}
<a href="/">Home
</a>
</div>
);
};

export default ListAllTweets;

37 changes: 37 additions & 0 deletions practice-app/client/pages/useStorage.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,37 @@
type StorageType = 'session' | 'local';
type UseStorageReturnValue = {
getItem: (key: string, type?: StorageType) => string;
setItem: (key: string, value: string, type?: StorageType) => boolean;
removeItem: (key: string, type?: StorageType) => void;
};

const useStorage = (): UseStorageReturnValue => {
const storageType = (type?: StorageType): 'localStorage' | 'sessionStorage' => `${type ?? 'session'}Storage`;

const isBrowser: boolean = ((): boolean => typeof window !== 'undefined')();

const getItem = (key: string, type?: StorageType): string => {
return isBrowser ? window[storageType(type)][key] : '';
};

const setItem = (key: string, value: string, type?: StorageType): boolean => {
if (isBrowser) {
window[storageType(type)].setItem(key, value);
return true;
}

return false;
};

const removeItem = (key: string, type?: StorageType): void => {
window[storageType(type)].removeItem(key);
};

return {
getItem,
setItem,
removeItem,
};
};

export default useStorage;
8 changes: 8 additions & 0 deletions practice-app/client/styles/globals.css
Original file line number Diff line number Diff line change
Expand Up @@ -97,3 +97,11 @@ body {
color: #e2e2e2;
border-radius: 5px;
}

tr:nth-child(even) {
background-color: aliceblue;
}

tr:nth-child(odd) {
background-color: lightyellow;
}
Loading

0 comments on commit d7566ec

Please sign in to comment.