Skip to content

Commit

Permalink
Merge pull request #45 from OilerNetwork/chart-bug-fixes
Browse files Browse the repository at this point in the history 
Chart bug fixes
  • Loading branch information
@0xDegenDeveloper
0xDegenDeveloper authored Dec 3, 2024
2 parents 805cf9b + dd3a28a commit 0fd48a7
Show file tree
Hide file tree
Showing 5 changed files with 69 additions and 58 deletions.
41 changes: 36 additions & 5 deletions src/app/api/getGasData/route.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -23,12 +23,14 @@ export async function GET(request: Request) {
const timestampFrom = searchParams.get("from_timestamp");
const timestampTo = searchParams.get("to_timestamp");
const twapRangeParam = searchParams.get("twap_range");
const roundStart = searchParams.get("round_start");

// Validate required parameters
if (!timestampFrom || !timestampTo || !twapRangeParam) {
if (!timestampFrom || !timestampTo || !twapRangeParam || !roundStart) {
return NextResponse.json(
{
error: "Missing from_timestamp, to_timestamp, or twap_range parameter",
error:
"Missing from_timestamp, to_timestamp, twap_range, or round_start parameter",
},
{ status: 400 },
);
Expand Down Expand Up @@ -103,22 +105,46 @@ export async function GET(request: Request) {
TWAP_BLOCK_LIMIT,
];

const pool =
new Pool({
const pool = new Pool({
connectionString: process.env.FOSSIL_DB_URL,
ssl: {
rejectUnauthorized: false, // For testing purposes; consider proper SSL config in production
},
});
const result = await pool.query(query, values);
pool.end();

if (result.rows.length == 0) {
result.rows.push({
block_number: undefined,
base_fee_per_gas: undefined,
timestamp: toTimestamp,
twap: undefined,
});
result.rows.push({
block_number: undefined,
base_fee_per_gas: undefined,
timestamp: fromTimestamp,
twap: undefined,
});
}

if (
result.rows.length >= 1 &&
result.rows[result?.rows?.length - 1].timestamp <= toTimestamp
) {
const lastKnownTimestamp = parseInt(
result.rows[result.rows.length - 1].timestamp,
);
if (lastKnownTimestamp <= Number(roundStart)) {
result.rows.push({
block_number: undefined,
base_fee_per_gas: undefined,
timestamp: roundStart,
twap: undefined,
});
}

if (
lastKnownTimestamp <=
toTimestamp -
Expand All @@ -143,11 +169,16 @@ export async function GET(request: Request) {
TWAP: row.twap ? formatUnits(parseInt(row.twap), "gwei") : undefined,
}));

data.sort((a, b) => a.timestamp - b.timestamp);

return NextResponse.json(data, { status: 200 });
} catch (error: any) {
console.error("Error fetching data", error);
return NextResponse.json(
{ error: "Internal server error", details: process.env.FOSSIL_DB_URL??"Error"},
{
error: "Internal server error",
details: process.env.FOSSIL_DB_URL ?? "Error",
},
{ status: 500 },
);
}
Expand Down
70 changes: 21 additions & 49 deletions src/components/Vault/PanelLeft.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -45,9 +45,9 @@ const FOSSIL_DELAY = 15 * 60;
// comment for git
const PanelLeft = ({ userType }: { userType: string }) => {
const { vaultState, selectedRoundState } = useProtocolContext();
const [vaultIsOpen, setVaultIsOpen] = useState<boolean>(true);
const [optionRoundIsOpen, setOptionRoundIsOpen] = useState<boolean>(true);
const [isPanelOpen, setIsPanelOpen] = useState<boolean>(false);
const [vaultIsOpen, setVaultIsOpen] = useState<boolean>(false);
const [optionRoundIsOpen, setOptionRoundIsOpen] = useState<boolean>(false);
const [isPanelOpen, setIsPanelOpen] = useState<boolean>(true);
const [modalState, setModalState] = useState<{
show: boolean;
action: string;
Expand All @@ -74,12 +74,6 @@ const PanelLeft = ({ userType }: { userType: string }) => {
await modalState.onConfirm();
};

// let date;
// if (selectedRoundState?.auctionEndDate)
// date = new Date(
// Number(selectedRoundState?.auctionEndDate),
// ).toLocaleString();

const getStateActionHeader = () => {
const round = selectedRoundState
? selectedRoundState
Expand All @@ -89,16 +83,6 @@ const PanelLeft = ({ userType }: { userType: string }) => {
? selectedRoundState.roundState
: "Open";

// if (roundState === "Open") {
// return "Auction Starts In";
// } else if (roundState === "Auctioning") {
// return "Auction Ends In";
// } else if (roundState === "Running") {
// return "Round Ends In";
// } else {
// return "Round Ended";
// }

if (roundState === "Open") return "Auction Starts In";
if (roundState === "Auctioning") return "Auction Ends In";
if (roundState === "Running") {
Expand Down Expand Up @@ -132,15 +116,6 @@ const PanelLeft = ({ userType }: { userType: string }) => {
}
if (roundState === "Settled") targetDate = round.optionSettleDate;

//if (roundState === "Running") targetDate = round.optionSettleDate;
//if (roundState === "Open") {
// targetDate = round.auctionStartDate;
//} else if (roundState === "Auctioning") {
// targetDate = round.auctionEndDate;
//} else {
// targetDate = round.optionSettleDate;
//}

targetDate = targetDate ? targetDate : "0";
return timeUntilTarget(Number(timestamp).toString(), targetDate.toString());
};
Expand Down Expand Up @@ -173,11 +148,6 @@ const PanelLeft = ({ userType }: { userType: string }) => {
},
};

// const [isClient, setIsClient] = useState(false);
// useEffect(() => {
// setIsClient(true);
// }, []);

const roundState = selectedRoundState?.roundState.toString() || "Open";
const styles = stateStyles[roundState] || stateStyles.Default;

Expand Down Expand Up @@ -254,8 +224,8 @@ const PanelLeft = ({ userType }: { userType: string }) => {
vaultIsOpen
? "h-[0]"
: optionRoundIsOpen
? "h-[325px]"
: "h-[265px]"
? "h-[215px]"
: "h-[215px]"
} transition-all duration-900ms `}
>
<div className="flex flex-row justify-between p-2 w-full">
Expand Down Expand Up @@ -446,20 +416,22 @@ const PanelLeft = ({ userType }: { userType: string }) => {
{selectedRoundState && selectedRoundState.roundState}
</p>
</div>
{(roundState === "Open" || roundState == "Auctioning") && (
<div className="max-h-full flex flex-row justify-between items-center p-2 w-full">
<p className="text-[#BFBFBF]">Last Round Perf.</p>
<div
onClick={() => {
console.log("todo: decrement selected round id");
}}
className="flex flex-row justify-center items-center text-[#F5EBB8] cursor-pointer gap-[4px]"
>
<p className="">+12.34%</p>
<ArrowRightIcon className="size-[16px]" />
</div>
</div>
)}
{
/// (roundState === "Open" || roundState == "Auctioning") && (
/// <div className="max-h-full flex flex-row justify-between items-center p-2 w-full">
/// <p className="text-[#BFBFBF]">Last Round Perf.</p>
/// <div
/// onClick={() => {
/// console.log("todo: decrement selected round id");
/// }}
/// className="flex flex-row justify-center items-center text-[#F5EBB8] cursor-pointer gap-[4px]"
/// >
/// <p className="">+12.34%</p>
/// <ArrowRightIcon className="size-[16px]" />
/// </div>
/// </div>
///)
}
{roundState === "Settled" && (
<div className="max-h-full flex flex-row justify-between items-center p-2 w-full">
<p className="text-[#BFBFBF]">Round Perf.</p>
Expand Down
3 changes: 2 additions & 1 deletion src/components/Vault/VaultChart/Chart.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -54,7 +54,7 @@ const RoundPerformanceChart = () => {
// const [maxDataPoints, setMaxDataPoints] = useState<number>(100);
const twapRange = useMemo(() => {
if (
!selectedRoundState?.auctionStartDate ||
!selectedRoundState?.auctionEndDate ||
!selectedRoundState?.optionSettleDate
)
return 1;
Expand Down Expand Up @@ -95,6 +95,7 @@ const RoundPerformanceChart = () => {
upperTimestamp: bounds ? bounds[1] : 0,
maxDataPoints,
twapRange,
roundStart: Number(selectedRoundState?.deploymentDate),
});

const [activeLines, setActiveLines] = useState<{ [key: string]: boolean }>({
Expand Down
12 changes: 10 additions & 2 deletions src/hooks/chart/useGasData.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -16,6 +16,7 @@ interface UseGasDataParams {
upperTimestamp: number;
maxDataPoints: number;
twapRange: number; // in seconds
roundStart: number;
}

// Define the API response type
Expand All @@ -26,12 +27,14 @@ const fetchGasData = async (
fromTimestamp: number,
toTimestamp: number,
twapRange: number,
roundStart: number,
): Promise<GetGasDataResponse> => {
const response = await axios.get("/api/getGasData", {
params: {
from_timestamp: fromTimestamp,
to_timestamp: toTimestamp,
twap_range: twapRange,
round_start: roundStart,
// You can add maxReturnBlocks and twapBlockLimit as query params if your API supports them
},
});
Expand All @@ -43,6 +46,7 @@ export const useGasData = ({
upperTimestamp,
maxDataPoints,
twapRange,
roundStart,
}: UseGasDataParams): {
gasData: GasDataPoint[] | undefined;
isLoading: boolean;
Expand All @@ -58,19 +62,23 @@ export const useGasData = ({
upperTimestamp,
twapRange,
maxDataPoints,
roundStart,
];

// Use React Query's useQuery
const { data, isLoading, isError, error } = useQuery({
queryKey,
queryFn: () => fetchGasData(lowerTimestamp, upperTimestamp, twapRange),
queryFn: () =>
fetchGasData(lowerTimestamp, upperTimestamp, twapRange, roundStart),

enabled:
typeof lowerTimestamp === "number" &&
typeof upperTimestamp === "number" &&
typeof twapRange === "number" &&
typeof roundStart === "number" &&
lowerTimestamp > 1 &&
upperTimestamp > 1,
upperTimestamp > 1 &&
roundStart > 1,
});

return {
Expand Down
1 change: 0 additions & 1 deletion src/lib/utils.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -98,7 +98,6 @@ export const getDurationForRound = (
if (!roundState || !roundState.auctionEndDate || !roundState.optionSettleDate)
return 0;

/// @NOTE Replace once sepolia instance duration >= 12 min
let high = Number(roundState.optionSettleDate);
let low = Number(roundState.auctionEndDate);
return Number(high - low);
Expand Down

0 comments on commit 0fd48a7

Please sign in to comment.