Show real edge location
This commit is contained in:
parent
8981701ba1
commit
90090776ca
|
@ -21,6 +21,7 @@ import {
|
|||
FileTextOutlined,
|
||||
EditOutlined,
|
||||
DashboardOutlined,
|
||||
GlobalOutlined,
|
||||
} from '@ant-design/icons';
|
||||
import { CheckboxValueType } from 'antd/lib/checkbox/Group';
|
||||
import useBreakpoint from 'antd/lib/grid/hooks/useBreakpoint';
|
||||
|
@ -48,6 +49,7 @@ import {
|
|||
const { TabPane } = Tabs;
|
||||
const { Content } = Layout;
|
||||
const { Step } = Steps;
|
||||
const edgeUnknown = 'Unknown';
|
||||
|
||||
const mapStateToProps = (state: AppState) => ({
|
||||
ui: state.ui,
|
||||
|
@ -65,6 +67,7 @@ const Log = ({ ui, config }: { ui: UIState, config: Config }) => {
|
|||
const [fetchError, setFetchError] = useState<Error>();
|
||||
const [parseError, setParseError] = useState<Error>();
|
||||
const [step, setStep] = useState(0);
|
||||
const [edgeLocation, setEdgeLocation] = useState(edgeUnknown);
|
||||
const contentRef = useRef<HTMLDivElement | null>(null);
|
||||
const margin = 30;
|
||||
const [canvasWidth, setCanvasWidth] = useState(0);
|
||||
|
@ -109,9 +112,10 @@ const Log = ({ ui, config }: { ui: UIState, config: Config }) => {
|
|||
const { signal } = controller;
|
||||
const loadData = async () => {
|
||||
try {
|
||||
const raw = await loadLogs((percent, total) => {
|
||||
const raw = await loadLogs((percent, total, edge) => {
|
||||
setProgress(percent);
|
||||
setFileSize(formatBytes(total));
|
||||
setEdgeLocation(edge || edgeUnknown);
|
||||
}, signal);
|
||||
|
||||
setFileSize(formatBytes(raw.byteLength));
|
||||
|
@ -211,7 +215,11 @@ const Log = ({ ui, config }: { ui: UIState, config: Config }) => {
|
|||
<Step
|
||||
title="Downloading"
|
||||
subTitle={fileSize}
|
||||
description={fetchError ? fetchError!.message : 'Edge location: FRA53-C1'}
|
||||
description={
|
||||
fetchError ? fetchError!.message : <Space>
|
||||
<GlobalOutlined />{edgeLocation}
|
||||
</Space>
|
||||
}
|
||||
status={fetchError && 'error'}
|
||||
/>
|
||||
<Step
|
||||
|
|
|
@ -0,0 +1,183 @@
|
|||
{
|
||||
"EZE51-C1": "Buenos Aires Argentina",
|
||||
"MEL50-C1": "Melbourne Australia",
|
||||
"PER50-C1": "Perth Australia",
|
||||
"SYD1-C1": "Sydney Australia",
|
||||
"SYD1-C2": "Sydney Australia",
|
||||
"VIE50-C1": "Vienna Austria",
|
||||
"BAH53-C1": "Manama Bahrain",
|
||||
"BRU50-C1": "Brussels Belgium",
|
||||
"GIG51-C2": "Rio de Janeiro Brazil",
|
||||
"GRU1-C2": "São Paulo Brazil",
|
||||
"GRU3-C1": "São Paulo Brazil",
|
||||
"GRU3-C2": "São Paulo Brazil",
|
||||
"GRU50-C1": "São Paulo Brazil",
|
||||
"SOF50-C1": "Sofia Bulgaria",
|
||||
"YUL62-C1": "Montréal, QC Canada",
|
||||
"YTO50-C1": "Greater Toronto, ON Canada",
|
||||
"YTO50-C3": "Greater Toronto, ON Canada",
|
||||
"YVR50-C1": "Vancouver, BC Canada",
|
||||
"SCL50-C1": "Santiago Chile",
|
||||
"BJS": "Beijing Beijing China",
|
||||
"HKG54-C1": "Hong Kong China",
|
||||
"HKG60-C1": "Hong Kong China",
|
||||
"HKG62-C1": "Hong Kong China",
|
||||
"HKG62-C2": "Hong Kong China",
|
||||
"SHA": "Shanghai, Shanghai China",
|
||||
"SZX": "Shenzhen, Shenzhen, GD China",
|
||||
"TPE50-C1": "Taipei TW China",
|
||||
"TPE51-C1": "Taipei TW China",
|
||||
"TPE52-C1": "Taipei TW China",
|
||||
"ZHY": "Zhongwei, Zhongwei, NX China",
|
||||
"BOG50-C1": "Bogotá Colombia",
|
||||
"ZAG50-C1": "Zagreb Croatia",
|
||||
"PRG50-C1": "Prague Prague Czech Republic",
|
||||
"CPH50-C1": " Kastrup Copenhagen Denmark",
|
||||
"CPH50-C2": " Kastrup Copenhagen Denmark",
|
||||
"HEL50-C1": "Helsinki Finland",
|
||||
"HEL50-C2": "Helsinki Finland",
|
||||
"MRS52-C1": "Marseille France",
|
||||
"CDG3-C1": "Paris France",
|
||||
"CDG3-C2": "Paris France",
|
||||
"CDG50-C1": "Paris France",
|
||||
"CDG50-C2": "Paris France",
|
||||
"TXL52-C1": "Berlin Germany",
|
||||
"DUS51-C1": "Düsseldorf Germany",
|
||||
"FRA2-C2": "Frankfurt Germany",
|
||||
"FRA6-C1": "Frankfurt Germany",
|
||||
"FRA50-C1": "Frankfurt Germany",
|
||||
"FRA53-C1": "Frankfurt Germany",
|
||||
"FRA56-C1": "Frankfurt Germany",
|
||||
"FRA56-C2": "Frankfurt Germany",
|
||||
"HAM50-C1": "Hamburg Germany",
|
||||
"HAM50-C2": "Hamburg Germany",
|
||||
"MUC51-C1": "Munich Germany",
|
||||
"ATH50-C1": "Eleftherios Venizelos Athens Greece",
|
||||
"BUD50-C1": "Budapest Hungary",
|
||||
"BLR50-C2": "Bangalore India",
|
||||
"MAA50-C1": "Chennai India",
|
||||
"MAA50-C2": "Chennai India",
|
||||
"MAA51-C1": "Chennai India",
|
||||
"MAA51-C2": "Chennai India",
|
||||
"HYD50-C1": "Hyderabad India",
|
||||
"HYD50-C2": "Hyderabad India",
|
||||
"CCU50-C1": "Kolkata India",
|
||||
"CCU50-C2": "Kolkata India",
|
||||
"BOM50-C1": "Mumbai India",
|
||||
"BOM51-C1": "Mumbai India",
|
||||
"BOM51-C2": "Mumbai India",
|
||||
"BOM52-C1": "Mumbai India",
|
||||
"DEL51-C1": "New Delhi India",
|
||||
"DEL54-C1": "New Delhi India",
|
||||
"DEL54-C3": "New Delhi India",
|
||||
"CGK52-C1": "Jakarta Indonesia",
|
||||
"DUB2-C1": "Dublin Ireland",
|
||||
"TLV50-C2": "Tel Aviv Israel",
|
||||
"MXP64-C1": "Milan Italy",
|
||||
"PMO50": "Falcone, Palermo Italy",
|
||||
"FCO50-C1": "Rome Italy",
|
||||
"FCO50-C2": "Rome Italy",
|
||||
"KIX56-C1": "Osaka Japan",
|
||||
"KIX56-C2": "Osaka Japan",
|
||||
"NRT12-C2": "Tokyo Japan",
|
||||
"NRT12-C4": "Tokyo Japan",
|
||||
"NRT20-C2": "Tokyo Japan",
|
||||
"NRT20-C3": "Tokyo Japan",
|
||||
"NRT20-C4": "Tokyo Japan",
|
||||
"NRT51-C2": "Tokyo Japan",
|
||||
"NRT51-C3": "Tokyo Japan",
|
||||
"NRT57-C1": "Tokyo Japan",
|
||||
"NRT57-C3": "Tokyo Japan",
|
||||
"NRT57-C4": "Tokyo Japan",
|
||||
"NBO50-C1": "Nairobi Kenya",
|
||||
"KUL50-C1": "Kuala Lumpur Malaysia",
|
||||
"QRO50-C1": "Querétaro Mexico",
|
||||
"QRO51-C1": "Querétaro Mexico",
|
||||
"AKL50-C1": "Auckland New Zealand",
|
||||
"AKL50-C2": "Auckland New Zealand",
|
||||
"OSL50-C1": " Gardermoen Oslo Norway",
|
||||
"MNL50-C1": "Manila Philippines",
|
||||
"WAW50-C1": "Warsaw Poland",
|
||||
"LIS50-C1": "Lisbon Portugal",
|
||||
"OTP50-C1": "Bucharest Romania",
|
||||
"SIN2-C1": "Singapore Singapore",
|
||||
"SIN5-C1": "Singapore Singapore",
|
||||
"SIN52-C2": "Singapore Singapore",
|
||||
"SIN52-C3": "Singapore Singapore",
|
||||
"CPT52-C1": "Cape Town South Africa",
|
||||
"JNB50-C1": "Johannesburg South Africa",
|
||||
"ICN51-C1": "Seoul South Korea",
|
||||
"ICN51-C2": "Seoul South Korea",
|
||||
"ICN54-C1": "Seoul South Korea",
|
||||
"ICN54-C2": "Seoul South Korea",
|
||||
"ICN55-C1": "Seoul South Korea",
|
||||
"MAD50-C1": "Madrid Spain",
|
||||
"MAD51-C2": "Madrid Spain",
|
||||
"ARN1-C1": "Stockholm Sweden",
|
||||
"ARN54-C1": "Stockholm Sweden",
|
||||
"ZRH50-C1": "Zürich Switzerland",
|
||||
"BKK50-C2": "Bangkok Thailand",
|
||||
"AMS1-C1": "Schiphol Amsterdam Netherlands",
|
||||
"AMS50-C1": "Schiphol Amsterdam Netherlands",
|
||||
"AMS54-C1": "Schiphol Amsterdam Netherlands",
|
||||
"DXB50-C1": "Dubai United Arab Emirates",
|
||||
"FJR50-C1": "Fujairah United Arab Emirates",
|
||||
"LHR3-C2": "London UK",
|
||||
"LHR52-C1": "London UK",
|
||||
"LHR61-C2": "London UK",
|
||||
"LHR62-C1": "London UK",
|
||||
"LHR62-C3": "London UK",
|
||||
"LHR62-C4": "London UK",
|
||||
"MAN50-C3": "Manchester UK",
|
||||
"IAD50-C2": "Ashburn, VA US",
|
||||
"IAD66-C1": "Ashburn, VA US",
|
||||
"IAD66-C2": "Ashburn, VA US",
|
||||
"IAD79-C2": "Ashburn, VA US",
|
||||
"IAD79-C3": "Ashburn, VA US",
|
||||
"IAD89-C3": "Ashburn, VA US",
|
||||
"ATL50-C1": "Atlanta, GA US",
|
||||
"ATL51-C1": "Atlanta, GA US",
|
||||
"ATL56-C1": "Atlanta, GA US",
|
||||
"ATL56-C3": "Atlanta, GA US",
|
||||
"BOS50-C1": "Boston, MA US",
|
||||
"BOS50-C3": "Boston, MA US",
|
||||
"ORD50-C1": "Chicago, IL US",
|
||||
"ORD51-C2": "Chicago, IL US",
|
||||
"ORD52-C2": "Chicago, IL US",
|
||||
"ORD53-C1": "Chicago, IL US",
|
||||
"DFW50-C1": "Dallas/Fort Worth, TX US",
|
||||
"DFW53-C1": "Dallas/Fort Worth, TX US",
|
||||
"DFW55-C3": "Dallas/Fort Worth, TX US",
|
||||
"DEN52-C1": "Denver, CO US",
|
||||
"HIO50-C1": "Hillsboro, OR US",
|
||||
"HIO50-C2": "Hillsboro, OR US",
|
||||
"IAH50-C1": "Houston, TX US",
|
||||
"IAH50-C3": "Houston, TX US",
|
||||
"JAX1-C1": "Jacksonville, FL US",
|
||||
"LAX3-C4": "Los Angeles, CA US",
|
||||
"LAX50-C1": "Los Angeles, CA US",
|
||||
"LAX50-C3": "Los Angeles, CA US",
|
||||
"LAX50-C4": "Los Angeles, CA US",
|
||||
"MIA3-C2": "Miami, FL US",
|
||||
"MIA3-C3": "Miami, FL US",
|
||||
"MSP50-C1": "Minneapolis, MN US",
|
||||
"MSP50-C2": "Minneapolis, MN US",
|
||||
"JFK51-C1": "New York, NY US",
|
||||
"EWR50-C1": "Newark, NJ US",
|
||||
"EWR52-C2": "Newark, NJ US",
|
||||
"EWR52-C3": "Newark, NJ US",
|
||||
"EWR52-C4": "Newark, NJ US",
|
||||
"EWR53-P1": "Newark, NJ US",
|
||||
"PHL50-C1": "Philadelphia, PA US",
|
||||
"PHX50-C1": "Phoenix, AZ US",
|
||||
"PHX50-C2": "Phoenix, AZ US",
|
||||
"SLC50-C1": "Salt Lake City, UT US",
|
||||
"SFO5-C1": "San Francisco, CA US",
|
||||
"SFO5-C3": "San Francisco, CA US",
|
||||
"SFO20-C1": "San Francisco, CA US",
|
||||
"SFO53-C1": "San Francisco, CA US",
|
||||
"SEA19-C1": "Seattle, WA US",
|
||||
"SEA19-C2": "Seattle, WA US",
|
||||
"SEA19-C3": "Seattle, WA US",
|
||||
"IND6": "Indianapolis, South Bend, IN US"
|
||||
}
|
|
@ -1,9 +1,19 @@
|
|||
export type onProgress = (percent: number, total: number) => void;
|
||||
import locations from '../data/s3-edge-locations.json';
|
||||
|
||||
type LocationsType = { [index: string]: string };
|
||||
|
||||
export type onProgress = (percent: number, total: number, edgeLocation: string | null) => void;
|
||||
|
||||
export const fetchWithProgress = async (url: string, onProgress?: onProgress, signal?: AbortSignal): Promise<ArrayBuffer> => {
|
||||
const response = await fetch(url, { signal });
|
||||
const contentLength = response.headers.get('Content-Length');
|
||||
const isContentEncoded = !!response.headers.get('Content-Encoding');
|
||||
const isContentEncoded = response.headers.has('Content-Encoding');
|
||||
const edgeLocationCode = response.headers.get('x-amz-cf-pop');
|
||||
let edgeLocation = null;
|
||||
|
||||
if (edgeLocationCode) {
|
||||
edgeLocation = (locations as LocationsType)[edgeLocationCode];
|
||||
}
|
||||
|
||||
if (!contentLength || isContentEncoded) {
|
||||
// fallback to full buffer
|
||||
|
@ -28,7 +38,7 @@ export const fetchWithProgress = async (url: string, onProgress?: onProgress, si
|
|||
|
||||
if (onProgress) {
|
||||
// eslint-disable-next-line no-bitwise
|
||||
onProgress(~~(at / length * 100), length);
|
||||
onProgress(~~(at / length * 100), length, edgeLocation);
|
||||
}
|
||||
}
|
||||
|
||||
|
|
Loading…
Reference in New Issue