frontend: React Auto-Complete Search Bar Component
// --------------- API:BEGIN --------------
faker.seed(42);
const users = Array.from({ length: 100 }).map(() => ({
name: faker.name.findName(),
email: faker.internet.email(),
}));
const fuse = new Fuse(users, {
shouldSort: true,
threshold: 0.6,
location: 0,
distance: 100,
maxPatternLength: 32,
minMatchCharLength: 1,
keys: ['name'],
});
/**
* Search users by name
* @param {string} query - The query to search users by
* @return {Promise<{ name: string; email: string; }[]>} Search result
*/
const searchUsersByName = (query) => new Promise((resolve) => resolve(fuse.search(query)));
// ---------------- API:END ---------------
const { useState, useEffect } = React;
const App = () => {
const [query, setQuery] = useState('');
const [results, setResults] = useState([]);
useEffect(() => {
if (!query.trim()) {
setResults([]);
return;
}
let cancelled = false;
searchUsersByName(query).then((matches) => {
if (!cancelled) {
setResults(matches);
}
});
return () => {
cancelled = true;
};
}, [query]);
const handleSelect = (user) => {
setQuery(user.name);
setResults([]);
};
return (
<div className="search-bar">
<h1 className="search-bar__title">Search Users</h1>
<input
className="search-bar__input"
type="text"
value={query}
onChange={(e) => setQuery(e.target.value)}
/>
<div className="search-bar__autocomplete-container">
{results.map((user) => (
<Item key={user.email} user={user} onSelect={handleSelect} />
))}
</div>
</div>
);
};
const Item = ({ user, onSelect }) => (
<div
role="button"
className="search-bar__autocomplete-item"
onClick={() => onSelect(user)}
>
{user.name}
</div>
);
ReactDOM.render(
<App />,
document.getElementById('app')
);
filesystem: bank system - Promise + asynch transactions
// accounts -> id: value
// transaction -> amount, from, to, validate-Promise
function makeTransactions(accounts, transactions) {
return transactions.reduce((chain, transaction) => {
return chain.then((currentAccounts) => {
const { amount, from, to, validate } = transaction;
return validate()
.then(() => {
// resolved — transaction approved, transfer the money
return {
...currentAccounts,
[from]: currentAccounts[from] - amount,
[to]: currentAccounts[to] + amount,
};
})
.catch(() => {
// rejected — transaction denied, leave accounts unchanged
return currentAccounts;
});
});
}, Promise.resolve({ ...accounts }));
}
module.exports = { makeTransactions };
database: SQL Query
CREATE PROCEDURE solution()
BEGIN
WITH RECURSIVE alarms AS (
SELECT input_date AS alarm_date
FROM userInput
UNION ALL
SELECT alarm_date + INTERVAL 7 DAY
FROM alarms
WHERE YEAR(alarm_date + INTERVAL 7 DAY) = YEAR((SELECT input_date FROM userInput))
)
SELECT alarm_date
FROM alarms
ORDER BY alarm_date;
END